for循環遍歷LI問題

<ul id="ul1">
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
</ul>

window.onload = function (){
  var ULa = document.getElementById("ul1");
  var lia = ULa.getElementsByTagName("li");
  for(var i=0;i<lia.length;i++){javascript


}
   lia[i].onclick = function(){   alert(i);//此時打印的都是4 緣由是閉包的問題 解析程序首先會在事件處理程序內部查找,這個匿名函數內部沒有定義變量i,而後往上級查找,此時i爲4     }; };

下面作下分析:由於在for循環裏面指定給lia[i].onclick的事件處理程序,也就是onclick那個匿名函數是在for循環執行完成後(用戶單擊連接時)才被調用的。而調用時,須要對變量i求值,解析程序首先會在事件處理程序內部查找,但i沒有定義。而後,又到方法外部去查找,此時有定義,但i的值是4(只有i大於4纔會中止執行for循環)。所以,就會取得該值——這正是閉包(匿名函數)要使用其外部做用域中變量的結果。並且,這也是因爲匿名函數自己沒法傳遞參數(故而沒法維護本身的做用域)形成的。java

 

解決方法:閉包

一、window.onload = function(){
    var oUl = document.getElementById("ul1");
    var aLi = oUl.getElementsByTagName('li');
    for(var i=0;i<aLi.length;i++){
      (function(e){
        aLi[i].onclick = function(){
          console.log(i);//所有打印4
        }
      })(i);
    }
函數

}spa

二、從匿名包裝器中返回一個函數code

  window.onload = function(){
    var oUl = document.getElementById("ul1");
    var aLi = oUl.getElementsByTagName('li');
    for(var i=0;i<aLi.length;i++){
事件


    }      aLi [i].onclick = (function(e){    return function(){    alert(e + 1);   };    })(i);

    }ip

相關文章
相關標籤/搜索