javascript - addEventListener, for(), index. how to use closure?

I have this
code:

var items =
            this.llistat.getElementsByTagName('a');

for( var i = 0; i <
            items.length; i++ ){ 
 items[i].addEventListener('click', function(event)
            {
 alert( i );
 },
            items[i]);
}

where
the event is listened, but there are 3 items and the alert
allways print 3 on any of the elements (it doesn't respect the
index),

Dosen't
items[i] shouldn't do the job as
closure?

thanks!

Answer

That's a classical closure issue : you must
create a new function bound, not to the 'i' variable, but to its value at the time of
binding :

var items =
            this.llistat.getElementsByTagName('a');


for( var i = 0;
            i < items.length; i++ ) {
 items[i].addEventListener('click',
            listener.bind( null, i) );
}

function listener(index)
            {
 alert(index);
}