<body>
     <div style="border: 1px solid red;">1</div>
     <div style="border: 1px solid red;">2</div>
     <div style="border: 1px solid red;">3</div>
     <div style="border: 1px solid red;">4</div>
     <div style="border: 1px solid red;">5</div>
     <div style="border: 1px solid red;">6</div>
     <div style="border: 1px solid red;">7</div>
 </body>
var divArr = document.getElementsByTagName('DIV');
for(var i=0;i<divArr.length;i++){
    divArr[i].onclick = function(){alert(i);};
}为什么alert(i)总是同一个值,求原理说明,求解决方案?

解决方案 »

  1.   

    divArr[i].onclick = function(){alert(this.innerText);};
    将弹出1、2、3、4、5、6、7
      

  2.   

    divArr[i].onclick = function(){alert(i);};
    只有点击时候才会执行这个函数,但当你点击的时候,那个循环早就结束了,i就是最后的那个值
      

  3.   

    这个问题很早之前遇到过 用匿名函数可以避免这个问题
    <script type="text/javascript">
    var divArr = document.getElementsByTagName('div');
    for(var i=0;i<divArr.length;i++){
      (function(){
        var k = i;
        divArr[k].onclick = function(){alert(k);};
      })();
    }
    </script>