Setting onMouseOver dynamically

[UKuser]

Hi,

I have the following code:

var images =
document.getElementById('map').getElementsByTagName('img');
for (i=0;i<images.length;i++){ // go through each image -
needed to be 0 - for NA
var t = images.id;
if (t != iPd){ // as long as the current image id is not the
one submitted
document.getElementById(t).src = "world/"+t
+"_normal.gif"; // correct
document.getElementById(t).onmouseout = function()
{swapImage(t,"out");};
document.getElementById(t).onmouseover = function()
{swapImage(t,"over");};
}
}

My problem is that only the final t (which happens to be the continent
Australia) gets set with the elements swapImage whereas I would have
assumed that as the loop went through, each t would be set
dynamically.

Can I therefore also clarify - does getElement(x).onmouseout - monitor
events or set them or both?

Earlier in my code I use the exact same lines outside the for loop and
it works fine. Slightly confused.

Many thanks

A

 

[UKuser]

Hi,

I have the following code:

var images =
document.getElementById('map').getElementsByTagName('img');
for (i=0;i<images.length;i++){ // go through each image -
needed to be 0 - for NA
var t = images.id;
if (t != iPd){ // as long as the current image id is not the
one submitted
document.getElementById(t).src = "world/"+t
+"_normal.gif"; // correct
document.getElementById(t).onmouseout = function()
{swapImage(t,"out");};
document.getElementById(t).onmouseover = function()
{swapImage(t,"over");};
}
}

My problem is that only the final t (which happens to be the continent
Australia) gets set with the elements swapImage whereas I would have
assumed that as the loop went through, each t would be set
dynamically.

Can I therefore also clarify - does getElement(x).onmouseout - monitor
events or set them or both?

Earlier in my code I use the exact same lines outside the for loop and
it works fine. Slightly confused.

Many thanks

A

Found the fix:

document.getElementById(t).onmouseover = function()
{swapImage(this.id,"over");};
(which was the same as t)

But still interested if this actually sets the function or just
monitors it with the function given.

 

[Henry]

On Feb 26, 11:40 am, UKuser wrote:

My problem is that only the final t (which happens to be the
continent Australia) gets set with the elements swapImage
whereas I would have assumed that as the loop went through,
each t would be set dynamically.

A closure in javascript is an association of a function with the
environment represented by the scope chain that was in use at the
point of the creation of the function object. When the function
subsequently attempts to interact with that environment it interacts
with the environment in the state it is in at the time of the
interaction and not the sate it was in at the time of the creation of
the function. Thus your - t - has the last value that was assigned to
it and all your many inner functions are looking at a single - t - .
See:-

Can I therefore also clarify - does getElement(x).onmouseout -
monitor events or set them or both?

That question has no meaning in contexts.

Earlier in my code I use the exact same lines outside the for loop and
it works fine. Slightly confused.

One function object associated with one scope environment.

 

[sasuke]

A closure in javascript is an association of a function with the
environment represented by the scope chain that was in use at the
point of the creation of the function object. When the function
subsequently attempts to interact with that environment it interacts
with the environment in the state it is in at the time of the
interaction and not the sate it was in at the time of the creation of
the function. Thus your - t - has the last value that was assigned to
it and all your many inner functions are looking at a single - t - .

If a closure is just an association of the function object with the
environment represented by existing scope chain, isn't each and every
function created in Javascript a closure?

 

[Joost Diepenmaat]

If a closure is just an association of the function object with the
environment represented by existing scope chain, isn't each and every
function created in Javascript a closure?

In a way, yes. But the important thing about closures is that they hang
on to the environment as it was when the function was instantiated:

function make_closure(i) {
return function() { alert(i) };
}

var c1 = make_closure(1);
var c2 = make_closure(2);

c1();
c2();

 

[Henry]

If a closure is just an association of the function object
with the environment represented by existing scope chain,
isn't each and every function created in Javascript a closure?

In a very real sense, yes. For the entire life of any function object
it remains associated with the scope chain from the execution context
in which it was created. In that sense there is always a closure.
However, globally declared functions have a very short and
uninteresting scope chain, and inner functions would be short-lived
without positive action being taken to preserve them.

So 'closures' in the sense that people use them are actually taking
action to preserve a structure that is inherent in the process of
creating (and executing) function objects.