How do I include a variables's current value in a function construcor 1

[TonyJollans]

I really haven't got a proper grip on this, so I may be doing stupid things or asking stupid questions so I apologise in advance if that is the case, and if it is, do please tell me.

I have some constructs like this:

[tt] <A HRef = "Team.htm">
<IMG ID = "ButTm" Class = "Button">
</A>[/tt]

And I have JavaScript code which runs in the page's OnLoad event and loops through the images and does a few things. What I am struggling with is dynamically assigning the code I want to the IMG's parent A tag's mouseover event and having this code pass a reference to the child IMG tag's id. I can do it like this:

[tt] document.images.parentNode.onmouseover = function() {myFunc(this.childNodes[[highlight]0[/highlight]].id);};[/tt] in IE, or
[tt] document.images.parentNode.onmouseover = function() {myFunc(this.childNodes[[highlight]1[/highlight]].id);};[/tt] in Firefox

The difference is because of the way the different browsers assign Nodes to whitespace, and I want to do it like this:

[tt] document.images.parentNode.onmouseover = function() {myFunc(this.childNodes[[highlight]j[/highlight]].id);};[/tt] in all browsers.

I have code which checks and assigns the correct value to my variable, j. I can't, however, assign the value of j to the event code because everything to the right of the equals sign is taken as literal text. This means that the variable j itself is included in the code assigned to the event rather than its value, and its value at event time is passed to the event instead of its value at assignment time.

I have got round it by putting extra code in the assigned function, myFunc, but don't like having to do it that way and would like to properly understand what I'm working with. How can I code it so that the j is translated 'up front'?

Enjoy,
Tony

--------------------------------------------------------------------------------------------
We want to help you; help us to do it by reading this: Before you ask a question.
Excel VBA Training and more Help at VBAExpress[

 

[jemminger]

why not let myFunc() handle the browser sniffing, then you can just pass the childNodes array and let it decide whether to use [0] or [1]

document.images.parentNode.onmouseover = function() { myFunc(this.childNodes); };

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); } finally { rtfm(); }

 

[TonyJollans]

Thanks Jeff,

That's exactly what I have done but I would prefer to do it up front:

(a) for performance - granted it's probably trivial but I'd rather the code ran once than every mouseover, and
(b) I really want to understand what I'm working with. Why is my unquoted text being treated as a literal string?

Enjoy,
Tony

--------------------------------------------------------------------------------------------
We want to help you; help us to do it by reading this: Before you ask a question.
Excel VBA Training and more Help at VBAExpress[

 

[BillyRayPreachersSon]

Why not use:

document.images[i].parentNode.onmouseover = function() {myFunc(this.getElementsByTagName('img')[0].id); }

Which should work (and be identical code) for all browsers.

Hope this helps,
Dan

 

[TonyJollans]

Thanks Dan,

That appears to work and so achieves part of what I want; it is also probably simpler than what I was doing, but it doesn't help me understand what is happening.

I want to dynamically assign code to the onmouseover event. When I try and use a string value (equivalent to how I would hard code it in place) it doesn't work (presumably due in some way to how and when code is compiled - but I'm guessing here). I have managed to make it work with the function contruction but I don't understand how my unquoted text is being treated.

How can I mix variables and literals in dynamicaly building a function? Nothing I try seems to work. I suspect my terminology is wrong but what I have is a function literal (?) and what I might want is a function constructor (?); however [tt]function("myFunc(this.childNodes["+j+"].id);")[/tt] and all variations on the theme I have tried all fail.

Enjoy,
Tony

--------------------------------------------------------------------------------------------
We want to help you; help us to do it by reading this: Before you ask a question.
Excel VBA Training and more Help at VBAExpress[

 

[BillyRayPreachersSon]

Tony,

Try this for size:

document.images[i].parentNode.onmouseover = new Function('myFunc(this.getElementsByTagName(\'img\')[0].id);')

You should be able to insert variables into the mix too... For example, if there were multiple images within the A tag, you might use something like:

document.images[i].parentNode.onmouseover = new Function('myFunc(this.getElementsByTagName(\'img\')[' + imageNum + '].id);')

Hope this helps,
Dan

 

[TonyJollans]

Thankyou Dan.

I thought I'd tried everything (isn't it always that way?). I did what (I thought) you'd said and it didn't work, so I cut and pasted your code and it did work so I examined it letter by letter and found out what I was doing wrong. I had:

[tt] new function('....[/tt]

and I should have had:

[tt] new [highlight]F[/highlight]unction('....[/tt]

Have a star!

Enjoy,
Tony

--------------------------------------------------------------------------------------------
We want to help you; help us to do it by reading this: Before you ask a question.
Excel VBA Training and more Help at VBAExpress[

 

[BillyRayPreachersSon]

As yes - the old case-sensitive chestnut. It's been a while since I've seen one of those ;o)

Good to see it worked in the end!

Dan