435,144 Members | 880 Online
Need help? Post your question and get tips & solutions from a community of 435,144 IT Pros & Developers. It's quick & easy.

# Problem with dynamically set onclick

 P: n/a Hi everyone. Please, check my test code here: http://skocz.pl/jstest . The trouble is that no matter which span element I click, it alerts '3' and I'm wondering why not '1' for the first span, '2' for second and '3' for third ? Anybody has any idea ? Best regards, ABS Jan 2 '07 #1
7 Replies

 P: n/a abs wrote: Hi everyone. Please, check my test code here: http://skocz.pl/jstest . The trouble is that no matter which span element I click, it alerts '3' and I'm wondering why not '1' for the first span, '2' for second and '3' for third ? The values should be 0, 1 and 2. Anybody has any idea ? You have discovered closures - the code of interest is: function setOnclicks() { spans = document.body.getElementsByTagName('span') for(i=0; i There are probably other solutions, search the archives for 'onclick closure' -- Rob Jan 2 '07 #2

 P: n/a abs wrote: Please, check my test code here: http://skocz.pl/jstest . The trouble is that no matter which span element I click, it alerts '3' and I'm wondering why not '1' for the first span, '2' for second and '3' for third ? Anybody has any idea ? The reason is because all the functions you use in your assignment, all reference the same variable i. After your assigment, the i changes, and these functions reflect the change. If one of the functions changed the value for i, the other would see the same change. Here's one way to solve this: function set(i) { return function() {testfunction(i)} }; for(i=0; i

 P: n/a "RobG"

 P: n/a

 P: n/a abs wrote: Hi everyone. Please, check my test code here: http://skocz.pl/jstest . The trouble is that no matter which span element I click, it alerts '3' and I'm wondering why not '1' for the first span, '2' for second and '3' for third ? Anybody has any idea ? Best regards, ABS The value of i, which is a global variable, at then end of the for loop is 3. The invocation, testfunction(i) in the onclick event uses the current value of i, not the value when the onclick event was established. As a side note, the values you want will never be displayed in the alert box, because the variable i has a range of 0-2; at the first span, i is 0, then 1, and finally 2. The loop terminates when i >=spans.length, which in this case, is 3. There are a number of ways to fix the code to do what you want. Here is one way: function setOnclicks() { spans = document.body.getElementsByTagName('span') for(i=0; i

 P: n/a Bill W wrote on 02 jan 2007 in comp.lang.javascript: There are a number of ways to fix the code to do what you want. Here is one way: function setOnclicks() { spans = document.body.getElementsByTagName('span') for(i=0; i

 P: n/a RobG wrote: function setOnclicks() { var spans = document.body.getElementsByTagName('span') for(var i=0; i Closures involving DOM elements are not an issue in IE. Circular chains of reference including DOM elements provoke the IE memory leak issue. Closures are just one way if creating such chains, and not always in a way that is clearly evident. In this case, after the loop, nulling - span - and - spans - would ensure that no object on the inner function's scope chain referred to the elements to which the event handlers had been assigned, and so no _circular_ chain of references would exist. Richard. Jan 2 '07 #8

### This discussion thread is closed

Replies have been disabled for this discussion.