标签：写法 eve 处理程序 代码 显示 event i++ var 弹出框
<div>DIV 0</div> <div>DIV 1</div> <script> var divs = document.getElementsByTagName("div"); for (var i = 0; i < divs.length; i++) { divs[i].addEventListener("click",function(){ alert("divs #" +i+ "was clicked."); },false); } </script>
这段代码主要用来操作2个div,哪个div被点，然后弹出框提示第i个div被点;
问题是：无论点哪个div,弹出框提示的始终都是第二个div被点了。
以上代码中遇到了一个使用闭包和循环时常见的问题，也就是说函数绑定之后，闭包抓取的变量被更新了。这意味着，每一个绑定的函数处理程序都会一直显示i最后的值；
处理代码如下
<div>DIV 0</div> <div>DIV 1</div> <script> var divs = document.getElementsByTagName("div"); for (var i = 0; i < divs.length; i++) (function(n){ divs[n].addEventListener("click",function(){ alert("div #" +n+ "was clicked."); },false); })(i); </script>
<div>DIV 0</div> <div>DIV 1</div> <script> var divs = document.getElementsByTagName("div"); for (var i = 0; i < divs.length; i++) (function(n){ divs[n].addEventListener("click",function(){ alert("div #" +n+ "was clicked."); },false); })(i); </script>
加入一个即时函数，注意 for (var i = 0; i < divs.length; i++) 后面的代码的写法(即时函数的写法)。
fo循环里，i的值变化，n的值也会跟着变化。
通过在for循环内加入即时函数，我们可以将正确的值传递给即时函数，进而让处理程序也得到正确的值。这意味着，在for循环每次迭代的作用域中，i变量都会重新定义，从而给click处理程序的闭包传入我们期望的值。
标签：写法 eve 处理程序 代码 显示 event i++ var 弹出框
原文地址：http://www.cnblogs.com/Jerry-spo/p/6438792.html
