JavaScript - Multiple Script Confusion

I am a new to js and GM but I am trying to make a script that will click a button on a page where there are multiple instances of the button.

The source I am looking at is below and I have narrowed down what I am looking at to the bold section.

<dl>
<dd class="left"><div id='recommendstatus_article4458331'>
<dl class="recommend">
<dt class='recs'><a href="javascript://" onclick="RecSpy( 'article', '4458331', 'tippers' ); return false;">50</a>&nbsp;</dt>

<dd><a href="javascript:void(0);"
onclick="RecommendItem(1,'article','4458331','1','recommendstatus_article4458331' ); return false;"
onmouseover="return overlib('Give thumbs up', WRAP);"
onmouseout="return nd();">&nbsp;<img class='icon' title='' alt='Thumb up' style='background-position: -304px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a></dd>
<dt class='tippers'><a href="javascript://" style='color: #969600;' onclick="RecSpy( 'article', '4458331', 'tippers' ); return false;"></a></dt>
<dd><a href="javascript:void(0);"
onmouseover = "return overlib( 'GeekGold Tip', WRAP );"
onmouseout = "nd();"
onClick="GeekGoldTip(0,'article','4458331','recommendstatus_article4458331'); return false;">&nbsp;<img class='icon' title='' alt='tip' style='background-position: -368px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a></dd>
<dd>
<a href="javascript:void(0);"
onclick="RecommendItem(0,'article','4458331','','recommendstatus_article4458331', 'article4458331' ); return false;"
onmouseover="return overlib('Hide this post', WRAP);"
onmouseout="return nd();">&nbsp;<img class='icon' title='' alt='Thumb up' style='background-position: -336px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a>
</dd>
<dt class='thumbsdown'>
</dt>
</dl>

How do I create a script to find each instance of the button and click it?

Hi, I am new to javascript so any help would be much appreciated.

I found the following script online to show/hide a login div.

<script language="JavaScript" type="text/javascript">
function login(showhide){
if(showhide == "show"){
document.getElementById('popupbox').style.visibility="visible";
}else if(showhide == "hide"){
document.getElementById('popupbox').style.visibility="hidden";
}
}
</script>

It works really well but I have other div I would also like to show/hide. Is it possible to have a variable in the function that I could pass the name of the div to show/hide.

I have a ul list that I am using for a navigation menu and I would like to be able to click on items in the list to show different div's. I assume this is possible, so could someone please give me an indication of how to do it as I have been trying for a few days now and no joy.

Thanks, James

Im using the following script:
Code:

<script type="text/javascript">
 function unhide(hiddentext) {
 var item = document.getElementById(hiddentext);
 if (item) {
 item.className=(item.className=='hidden')?'unhidden':'hidden';
 }
 }
 </script>
  <style type="text/css">

.unhidden { display: block; }
.hidden { display: none; }
</style>

to hide and unhide a block of text on my page, using onclick events.

the problem is its not allowing me to use it multiple times in a page.
when i use a second instance of it, both stop working.

the above demonstrated script is working with the following elements:

middle (approx) of page:
Code:

<td class="desc_cell"><strong>Download Station</strong><br /> 
                17&quot; Macbook Pro<br /><a href="javascript:unhide('itemlist');" onclick="changeText(this,'Hide Item List');" id="text1link"]Old Text>Click Here For Full Item List</a><div id="hiddentext" class="hidden">list of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes here</div>
</td>

bottom of page:
[code]<p align="center" style="citylist">Allen Park MI, Anchor Bay Gardens MI, Anchor Bay Harbor MI, Anchor Bay Shores MI, Andersonville MI,<a href="javascript:unhide('hiddentext');" onclick="changeText(this,' View Less...');" id="text1link"]Old Text>View More...</a></p><div id="hiddentext" class="hidden">Armada MI, Auburn Heights MI, Auburn Hills MI, Austin Corneorth Farmington MI, Northville MI, Norton MI, Novi MI, Oak MI, Oak Grove MI, Oak Park MI, Oakley Park MI, Oakwood MI, Orchard Lake MI, Ortonville MI, Oxbow MI, Oxford MI, Perry Lake Heights MI, Pleasant Ridge MI, Plymouth MI, Point Lakeview MI, Pontiac MI, Preston Coom MI, Wolcott Mills MI, Wolverine Lake MI, Wood Creek Farms MI, Woodhaven MI, Wyandotte MI, Yates MI, and many more!</div>

I'm an artist working on a project that involves 9 swfs embedded in a html page and placed in tables. Although each swf has it's own volume control and pause/play buttons on mouseover, I need an outside script
like java, that can be used to stop and start a few swf's simultaneously so that 3 or 4 play while the others are paused. There would be a few different combinations of them playing together that would be opted for by a menu choice. The swf's are in an old version of Macromedia Flash MX 6 using Action Script 2.
I have absolutely no experience writing java scripting. None. I would be glad to pay somebody to write it for me. The page is online. If interested, I can forward the link.
Thanks for your time.

I am having trouble implementing this script.

I am not a coder so please give exact, idiot proof advise. :-)

Thank You.

<script>
(function() {
var cx = 'user_id:field_id1';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);

// This basically takes the value of the radio button (requires jQuery)
$("input:radio[name='GCSField']").change(function() {
cx = $(this).val();
});

})();
</script>
<label for="user1">
<input name=GCSField id="user1" type="radio" value="user_id:field_id1" checked >User Field 1 </label>
<label for="user2">
<input name=GCSField id="user2" type="radio" value="user_id:field_id2">User Field 2 </label>

<gcse:search></gcse:search>

Here is my html.

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8">
<!--[if lt IE 9]><script src=http://html5shiv.googlecode.com/svn/trunk/html5.js></script><![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<title>TEST</title> <meta name="robots" content="noindex, nofollow"> <meta name="viewport" content=" width=device-width, initial-scale=1"><meta name="HandheldFriendly" content="true"><meta name="MobileOptimized" content="320">
<style>body{width:100%;max-width:25em;margin-left:auto;margin-right:auto;font-family:Verdana,'Palatino Linotype',Palatino,'Book Antiqua',Arial,Helvetica,sans-serif;text-align:justify;font-size:105%;background-color:#000;background:#000;}p{margin-bottom:1%;}strong{font-size:115%;font-weight:bold;}a{line-height:200%;text-decoration:underline;color:#0007C6;}article{margin: 0 0 1% 0; color:#000;background:#FEE800;background-color:#FEE800; text-align: center;}</style>
</head><body>
<article>
<div><script>
(function() {
var cx = 'user_id:field_id1';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);

// This basically takes the value of the radio button (requires jQuery)
$("input:radio[name='GCSField']").change(function() {
cx = $(this).val();
});

})();
</script>
<label for="user1">
<input name=GCSField id="user1" type="radio" value="011565775292567206849:xkh-s7ljiug" checked >User Field 1 </label>
<label for="user2">
<input name=GCSField id="user2" type="radio" value="partner-pub-4173665486685435:n2tml3-z5vf">User Field 2 </label>
<gcse:search></gcse:search></div>
<div><gcse:searchresults></gcse:searchresults></div>
</article>
</body></html>

Here is the above page off a server TEST

Thanks again.

This is some code that I found that does what I need to do. However in this code I need to create a new var for each item. I have a lot of item in my list that I want to add to the drop down. Is there a simpler way to do this in JS?

Cheers Daniel.

Code:

<HTML>
<HEAD>
<TITLE></TITLE>
<META NAME="GENERATOR" Content="Microsoft Visual Studio">
<META HTTP-EQUIV="Content-Type" content="text/html; charset=UTF-8">
</HEAD>
<BODY>&nbsp;

<input type="button" value="Show me the menu!"
  onclick="populateSelect();" ID=Button1/>

<input type="button" value="Clear it"
  onclick="var f = document.getElementById('foodOptions');
  while (f.hasChildNodes()) { f.removeChild(f.firstChild); }" ID=Button2/>

<script>
function populateSelect() {

  // create optgroups
  var breakfast = document.createElement("optgroup");
  breakfast.label = "Breakfast";
  var lunch = document.createElement("optgroup");
  lunch.label = "Lunch";
  var dinner = document.createElement("optgroup");
  dinner.label = "Dinner";

  // create options and attach to optgroups
  var cereal = document.createElement("option");
  cereal.value = "cereal";
  cereal.appendChild(document.createTextNode("Cereal"));
  breakfast.appendChild(cereal);

  var eggs = document.createElement("option");
  eggs.value = "eggs";
  eggs.appendChild(document.createTextNode("Eggs"));
  breakfast.appendChild(eggs);

  var toast = document.createElement("option");
  toast.value = "toast";
  toast.appendChild(document.createTextNode("Toast"));
  breakfast.appendChild(toast);

  var sandwich = document.createElement("option");
  sandwich.value = "sandwich";
  sandwich.appendChild(document.createTextNode("Sandwich"));
  lunch.appendChild(sandwich);

  var soup = document.createElement("option");
  soup.value = "soup";
  soup.appendChild(document.createTextNode("Soup"));
  lunch.appendChild(soup);

  var meat = document.createElement("option");
  meat.value = "meat";
  meat.appendChild(document.createTextNode("Meat"));
  dinner.appendChild(meat);

  var potatoes = document.createElement("option");
  potatoes.value = "potatoes";
  potatoes.appendChild(document.createTextNode("Potatoes"));
  dinner.appendChild(potatoes);

  var vegetables = document.createElement("option");
  vegetables.value = "vegetables";
  vegetables.appendChild(document.createTextNode("Vegetables"));
  dinner.appendChild(vegetables);

  // set "eggs" as the default
  eggs.selected = true;

  // clear select menu and append optgroups
  var selectMenu = document.getElementById("foodOptions");
  while (selectMenu.hasChildNodes()) {
    selectMenu.removeChild(selectMenu.firstChild);
  }
  if (breakfast.hasChildNodes()) { selectMenu.appendChild(breakfast); }
  if (lunch.hasChildNodes()) { selectMenu.appendChild(lunch); }
  if (dinner.hasChildNodes()) { selectMenu.appendChild(dinner); }
}
</script>
 <select id=foodOptions></select>
</BODY>
</HTML>

Hello,

I'm working on a set of animation code for school and I keep getting an error like this: Uncaught SyntaxError: Unexpected token ILLEGAL on line 25 of the code. What am I missing and/or what is out of place?

Code:

var canvas;
var context;
var CanvasWidth = 0;
var CanvasHeight = 0;
var FPS = 60;
var x = 0;
var y = 0;
var background;
var critter = [];


window.onload = init;
function init()
    {     
       	 canvas = document.getElementById("myCanvas");
         context = canvas.getContext("2d");
         CanvasWidth = canvas.width;
         CanvasHeight = canvas.height;
	background = new Background();
	for (var i = 0; i < 6; i++);
    }
     {
           critter[i] = new Critter();
          }

 function Background ()  
{ 
var obj ={};
obj.draw = function()
{
context.clearRect(0, 0, CanvasWidth, CanvasHeight);
          var gradient = context.createLinearGradient(0, 0, 0, CanvasHeight);
    gradient.addColorStop(0.0,    "#C0F5E7"); 
    gradient.addColorStop(0.8,    "#3F43E7");
    gradient.addColorStop(0.81,   "#AF8553");
    gradient.addColorStop(1.0,    "#E6CBAB");
	setInterval(loop, 1000/FPS );
    context.fillStyle = gradient;
    context.fillRect(0, 0, CanvasWidth, CanvasHeight);
 };
return obj;
}        

function Critter() {
var obj = {};
obj.x = 0;
obj.y = 0;
obj.vx = Math.random() * 2 - 1;
obj.vy = Math.random() * 2 - 1;
obj.update =  function()
{
     obj.x += obj.vx;
     obj.y += obj.vy;
    }
function bounds()
     {
     	if (obj.x > canvas.width)
     	{
     		obj.x = Math.random() * 2 - 1;
			obj.y = Math.random() * 2 - 1;
			obj.x += obj.vx;
			obj.y += obj.vy;
			}
}
obj.draw =  function() 
{
           context.fillStyle="#AA0000";
           context.fillRect(obj.x, obj.y, 25 , 25);

};
}
}



function draw() 
{
 context.clearRect(0, 0, CanvasWidth, CanvasHeight);
         background.draw();
         for (var i = 0; i < critter.length-1; i++)   
         {
         	critter[i].draw();
}	
}
function loop() 
{ 
	
update();
draw(); 
}
	
function update() 
{ 
	for (var i = 0; i < critter.length-1; i++)
	{
		critter[i].update();
	}
		critter[i].bounds();
}

Can anyone tell me how the following code actually works please? I've been trying to work out exactly why I need it all, but can't understand it at all!

Code:

var speed = 50
var myInterval
var pause

function start(){
        window.clearInterval(pause) 
        myInterval = setInterval("auto()",speed)
      }

pause = setInterval("start()",3000)

The body onLoad is set to run start().

If anyone can explain why this code is needed I would be very greatful.

Can anyone tell me why the string comparison test doesn't work in this javascript function? It works if you use just text between the currentItem div tags, but not when you use html for an image. I even tried to use iso characters instead of angle brackets, as in "&lt;img src=expand.png&gt;&lt;/img&gt;" and still no dice. Why not?

Code:

<html>
<head></head>
<body>
<script language="JavaScript">
function toggleValue()
{
if(document.getElementById("currentItem").innerHTML != "<img src=expand.png></img>")
{
document.getElementById("currentItem").innerHTML = "<img src=expand.png></img>";
}else
{
document.getElementById("currentItem").innerHTML = "<img src=collapse.png></img>";
}
}

//-->
</script>

<table width =" 200" border="0">
<tr>
<td colspan=2><br><center>
<a href="javascript:toggleValue()">Toggle Value</a>
</center></td>

</tr>
<tr>
<td>
<strong>Value:</strong>
</td><td>
<div id="currentItem"><img src=expand.png></img></div>

</td>
</tr>
</table>
</body>
</html>

Thanks,
Neil

Hi all,

I am a little stuck trying to use arrays for the purpose of creating a currency converter. I have created the script below but it seem to work fine without the arrays added in. Any ideas?

<script type="text/javascript">


function currencyConverter()
{

//declare and initialise variables
var CurrYen = 128.7;
var CurrUSDollar = 1.59;
var CurrEuro = 1.15;
var CurrSwissFrank = 2.06;
var CurrDanishKorona = 9.69;


var strCurrency = new Array(5);
var dblExchange = new Array(5);

var dblGross
var dblCurrency


//collect information from drop-down menu and text boxes
strCurrency = document.getElementById("cmbCurrency").value;
intSterling = document.getElementById("txtSterling").value

//selection
if (strCurrency == "Yen")
{
dblCurrency = CurrYen;
}
else if (strCurrency == "US Dollar")
{
dblCurrency = CurrUSDollar;
}
else if (strCurrency == "Euro")
{
dblCurrency = CurrEuro;
}
else if (strCurrency == "Swiss Frank")
{
dblCurrency = CurrSwissFrank;
}
else if (strCurrency == "Danish Korona")
{
dblCurrency = CurrDanishKorona;
}
else
{
dblCurrency = 0;
}


//calculate total currency to convert
dblGross = dblCurrency * intSterling;

//display total cost
document.getElementById("txtSterling").value = dblGross.toFixed(2);

}

</SCRIPT>

Hello I'm having a very simple RegExp problem.

I have the text: Code:

sddsfdfs[br][CARET][br]<i>[/quote]</i></div>

And I want to match it against a Javascript RegExp: \[br\].*?\[\/quote\]<\/i>

Note I used to the non-greedy quantifier ( ? ) for .* , such that it should match the minimum.

I am expecting it therefore to match the first in the quote below, but instead it is matching the second:
Code:

1. [br]<i>[/quote]</i>
-------------------------------------------------
2. [br][CARET][br]<i>[/quote]</i>

I'm sure I've just missed something, I'd very grateful if someone could point out what this is?

Thanks

Why does...
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head><title></title>
<script language = "javascript">

	function start() {document.writeln (testPara.innerHTML = "Object reassignment");}

</script></head>
<body onload="start()">

	<p id="testPara">Paragraph</p>

</body></html>

... only produce the output "Object reassignment"? After the onload event fires to execute the document.writeln method, isn't <body> processed to output the "testPara" object, now redefined, a 2nd time? Why does it not? What am I missing?

Alright, so I've been writing a plain javascript file, which is called by HTML later to grab information from a certain page and then parse through that information. This is being done as a Windows Gadget, so the "browser" is IE.

I have two main problems with this: One is caching. I can't get not caching to work at all. I've tried headers and I've tried putting something random at the end of the URL. The randomness at the end of the URL works when done from an HTML file embedded with Javascript but will not work from a pure Javascript file.

My other, potentially bigger, problem is that the xmlhttp object does not seem to ever want to open again. I'm pretty sure what's happening is it doesn't get back into ready state 4. That is, unless I run an html file that accesses the same url. Then, suddenly, the gadget runs its update function and it actually decides to work. The gadget still runs the update function otherwise but it doesn't actually do anything, which is I believe caused by it never getting back to ready state 4 on its own.

I appreciate any help on this, and if I didn't explain anything clearly I'm more than happy to clarify.

Cheers.

Greetings,

I am currently using the websites tutorial about browser detection using the navigator.

http://www.javascriptkit.com/javatutors/navigator.shtml

I am however finding myself unable to detect a pattern in order to learn from.

My aim is to use Browser detection to have a CSS file for each browser type, such as Firefox, IE, Opera, Safari and then an overall CSS file if none of the above, to fix numerous flaws.

For IE and Firefox using the site's code is all well and good and while I haven't tested it yet I'm wondering how to set up the coding so that it can detect a safari browser.

There are lots of slashes and d's and brackets and I do find myself unable to understand their purpose.

So if someone can explain how I could do it for Safari I would be very appreciative.