onclick in a link

[noob_developer]

I have this onclick in a link that calls a javascript function. This function holds two variables: 1) a 1 or -1 indicating a direction and 2) and a number representing the number of a picture to display. My problem is that I need to load a new number into that function when ever the next button is clicked. Here is what I have:

<a href = "#" id = "next" onClick = "processClick(1, 1);"><span>CSS2</span></a>

and the javascript looks like:

var next = document.getElementById('next');
next.onclick = '"processClick(1, 1);"';

The idea is that I want the onlclick attribute to have the old function call replaced with the new one when that code executes. However, next.onclick returns an [Object] and not a string value. How do I get at the string value for the onclick attribute? Thanks,

-Shandy

[Master_script_maker]

onclick is a null function. when you set it your actually changing it, so it will always return an object. so you would use

var next = document.getElementById('next');
next.onclick = processClick(1, 1);

[noob_developer]

I did try that, but what seems to happen is that that function gets executed insted of just setting the attribute for the link to that value. Am I wrong in assuming this is what is happening, or is possible I have a bug in my code?

[Master_script_maker]

try

var next = document.getElementById('next');
next.setAttribute("onclick", "processClick(1, 1)");

[noob_developer]

That seems to set the attribute correctly but when I try and go next again my script doesn't work. I am playing around with a picture gallery that allows you to hit the next (or the prev) button to view more pictures. It goes from the first to the second picture fine, but I think that is because the values are hard coded, but it won't gone from the second to the third. When I put an alert on the function calls my next.onlick says:

function anonymous()
{
   processClick(1, 1);
}

But after I try and re-set the onlcik value on the link, my alert just says:

"processClick(1,3);"

So it is setting the value correctly but I get the feeling something has changed from how the function is interrupted by javaScript.

Hope I made this clear and not to confussing.

-S

[jscheuer1]

Events need to be functions:

var next = document.getElementById('next');
next.onclick = function(){processClick(1, 3);};

You can even use variables, but it's a little tricky, as they must be declared in the same scope as the function. I'm not sure if you need to do this, or if you can just use the raw number, as I don't see the rest of your code. There are simpler ways to do this in most cases though, rather than passing the number to a new function, it could be kept track of elsewhere, and used in a static function.

[noob_developer]

That worked perfectly. One thing though is that the directory where my web pages resides keeps opening evertime I hit the next button - which fires off the javsScript. Is that related to the javaScript or am I just loosing my mind. Thanks for all the help,

-S

[jscheuer1]

That's probably because of the way your link is setup, there are several ways to deal with this if it is the issue. I like some of them, here's a fairly good one, change the HTML to:

<a href = "javascript:next();" id = "next" onClick = "processClick(1, 1);return false;"><span>CSS2</span></a>

And change the function update to:

var next = document.getElementById('next');
next.onclick = function(){processClick(1, 3);return false;};

Notes: At this point, the href value can now be anything you like because it will not fire when javascript is enabled. However, using a phony javascript call for the href will prevent it from firing when javascript is disabled. The phony call, if syntactically correct, may also be descriptive - a good idea, as it will show in the status bar on hover in many browsers. Alternatively, the href may be to a page - a fall back page for non-javascript users. The choice depends upon what you are trying to do, and upon what would be most helpful to your users, the javascript enabled and the javascript disabled.

[noob_developer]

that looks to have solved all my problems, thanks.

-S