addEventListener in un ciclo for

[lionell88]

Ragazzi dopo ore a sbatterci la testa mi arrendo e scrivo qua!

var divPrincipale=document.getElementById("div_link_sup");
	var linkPrincipali=divPrincipale.getElementsByTagName("li");//tutti i link (è un vettore)
	var totLinkPrincipali=linkPrincipali.length;   //alert(totLinkPrincipali);
	 for(i=0;i<totLinkPrincipali;i++){

	   var li=linkPrincipali[i];
	   var idLI=li.id;
	    li.addEventListener("mouseover",function(){alert(idLI);},false); 

         }//chiusura for

Gli id degli elementi li sono l_0, l_1, l_2, l_3 .... Non capisco però il motivo per cui passando il mouse su ogni elemento li mi daà sempre "l_3"... Lo trovo assurdo.

[Vindav]

Quando la funzione viene eseguita la variabile idLI è valorizzata con l'id dell'ultimo elemento del ciclo.

li.addEventListener("mouseover",function(){alert(this.id);},false);

[whisher]

function f() {
  var a = [];
  var i;
  for(i = 0; i < 3; i++) {
    a[i] = function(){
      return i;
    }
  }
  return a;
} 

ti ritornera sempre 3
mentre questa does the work

function f() {
  var a = [];
  var i;
  for(i = 0; i < 3; i++) {
    a[i] = (function(x){
      return function(){
        return x;
      }
    })(i);
  }
  return a;
} 

[lionell88]

Grazie ad entrambi.
Perché se io in quel ciclo, prima dell'addeventlistener, inserisco

alert(idLI)

mi fa 4 alert, uno per ogni id?

Con il this però vedo che funziona... ... mi devo vedere per bene il significato di quel this