onclick function

[manu3d]

Hi everybody,

I'm generating some DIVs dinamically, inclusive of
an event function to run when the user clicks on them.

While the following lines work perfectly in FF 1.5,
I.E. 6.0 ignores the onclick function alltogether:
the flow never gets into it, as if it hadn't been registered
properly. Yet, an inspection of the DOM with the
developer toolbar, reveals that the function is correctly
associated with the onclick attribute.

This is the code:

var imgNumber = 1;
var imgDot = document.createElement('div');

var onClickFunction = "ss_displayNthPicture("+imgNumber+")";
imgDot.setAttribute("onclick",onClickFunction);

document.body.appendChild(imgDot);
Any idea? Am I doing something wrong with quotes
and double quotes maybe? Or are there limitations
on the events a dynamically generated DIV can trigger?

Thanks for your help.

Manu

[JustinBlat]

It's possible IE just doesn't like using the setAttribute property on
event handlers, maybe you should try using attachEvent to add the event
to the object after it is added to the DOM.

http://msdn.microsoft.com/workshop/a...ttachevent.asp

This of course will only work in the case of IE.

ma****@gmail.com wrote:

Hi everybody,

I'm generating some DIVs dinamically, inclusive of
an event function to run when the user clicks on them.

While the following lines work perfectly in FF 1.5,
I.E. 6.0 ignores the onclick function alltogether:
the flow never gets into it, as if it hadn't been registered
properly. Yet, an inspection of the DOM with the
developer toolbar, reveals that the function is correctly
associated with the onclick attribute.

This is the code:

var imgNumber = 1;
var imgDot = document.createElement('div');

var onClickFunction = "ss_displayNthPicture("+imgNumber+")";
imgDot.setAttribute("onclick",onClickFunction);

document.body.appendChild(imgDot);
Any idea? Am I doing something wrong with quotes
and double quotes maybe? Or are there limitations
on the events a dynamically generated DIV can trigger?

Thanks for your help.

Manu

[Randy Webb]

ma****@gmail.com said the following on 7/23/2006 9:49 AM:

Hi everybody,

I'm generating some DIVs dinamically, inclusive of
an event function to run when the user clicks on them.

While the following lines work perfectly in FF 1.5,
I.E. 6.0 ignores the onclick function alltogether:
the flow never gets into it, as if it hadn't been registered
properly. Yet, an inspection of the DOM with the
developer toolbar, reveals that the function is correctly
associated with the onclick attribute.

This is the code:

var imgNumber = 1;
var imgDot = document.createElement('div');

var onClickFunction = "ss_displayNthPicture("+imgNumber+")";
imgDot.setAttribute("onclick",onClickFunction);

setAttribute is known to be buggy in IE. So, instead of setAttribute,
simply access it directly:

imgDot.onclick = onClickFunction;

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Temporarily at: http://members.aol.com/_ht_a/hikksnotathome/cljfaq/
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[manu3d]

Thanks for your help, Justin and Randy.

I had tried

imgDot.onclick = onClickFunction

but it didn't manage to coerce it to work.

attachEvent did work however, and I'm now using that method.

Again, thank you both.

Manu

[RobG]

ma****@gmail.com wrote:

Thanks for your help, Justin and Randy.

Please quote what you are replying to.

I had tried

imgDot.onclick = onClickFunction

Because onClickFunction should be a reference to a function, not a
string. Given that you originally tried:

var imgNumber = 1;
var imgDot = document.createElement('div');
var onClickFunction = "ss_displayNthPicture("+imgNumber+")";
imgDot.setAttribute("onclick",onClickFunction);

The fix is to use:

imgDot.onclick = function(){ss_displayNthPicture(imgNumber);}
If the above is inside some other function, then the reference back to
imgNumber creates a closure and hence may give an unexpected value for
imgNumber when ss_displayNthPicture() is called (or not). If that's a
problem, search recent posts to find a cure.

but it didn't manage to coerce it to work.

attachEvent did work however, and I'm now using that method.

What are you using for browsers that don't support IE's proprietary
attachEvent method?
--
Rob