JavaScript - How to add onclick event dynamically passing in a specific value?

Question

Could you please have a quick look at the sample code

I don't know if its clear, but what it's supposed to do is show what i was when the event was created. Instead what I think it's doing is showing the value of i when the event is fired.

How would I solve my issue?

Possible duplicate of Setting onclick to use current value of variable in loop and a few million others — Esailija
– Esailija, Commented Nov 24, 2011 at 20:58

Rob W · Accepted Answer · 2011-11-24 20:57:13Z

6

Wrap the loop's body in a function, to create a closure:

for(var i = 0; i < arr.length; i++){
    (function(i){ //i inside this function is a local var; not affected by i++
        arr[i].onclick = function(){
            alert(i);
            return false;
        };
    })(i); //Invoke the function, pass variable i 
}

Fiddle: http://jsfiddle.net/vXvs2/4/

answered Nov 24, 2011 at 20:57

Rob W

350k87 gold badges811 silver badges683 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ash Burlaczenko Over a year ago

:) Perfect, I've been looking for this for ages. +1

Rob W Over a year ago

Additionally, you can also pass arr[i], in case the DOM node gets modified. jsfiddle.net/vXvs2/5

Collectives™ on Stack Overflow

JavaScript - How to add onclick event dynamically passing in a specific value?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related