Hacker News Reader

Comment by mustpax | Hacker News Reader

Just adding var wouldn't be enough, you're still referencing the variable from the outer scope. You need to create your own copy. Instead of:

    els[i].addEventListener('click', function(){alert(i);});

Do:

    els[i].addEventListener('click',
        function() {
            var j = i;
            alert(j);
        });

Edit: This is wrong, archgoon has the correct answer below. That'll teach me for jumping on closure problems in the morning :)

That won't work either. You're still setting the variable to the global variable i. The only way I can think of doing this is as follows

els[i].addEventListener('click',function(k){function(){alert(k)}}(i));

EDIT: See lhorie's suggestion below for a much cleaner way of doing this. http://news.ycombinator.com/item?id=2124532

That won't quite work, as you're still just copying the value of i when that function is executed, which will be 4.

You could make the function take a parameter, then return a function which uses that parameter, or use currying.

Edit: I've posted a working version in my comment further down, http://news.ycombinator.com/item?id=2124559

I create a closure outside of the event registration: http://pastebin.com/igzWkgKF

I think you want var j = i outside the function.

Edit: Oops, this is wrong as well. :-)

alert('"'+i+'"')