在一个循环中添加事件侦听器与参数

Question

我以动态方式上单击事件创建按钮的方式如下：

//add button 
for(i=1;i<=narrow+1;i++){ 
    var btn = document.createElement("BUTTON"); 
    btn.id="element"+i; 
    var t = document.createTextNode("3D View"); 
    btn.appendChild(t); 
    btn.style.position="absolute"; 
    btn.style.top="520px"; 
    btn.style.left=100+120*(i-1)+"px"; 
btn.addEventListener('click', function(){window.alert(i-1+" "+nmol[i-1]);}); 

创建的按钮都不错，但在的addEventListener事件的函数的参数似乎没有完全可以增加。当我打印我留下价值1.

任何人都可以解释我为什么？

感谢

Answer 1

修改它，以便有循环

(function(index){ 
    btn.addEventListener('click', function(){window.alert(index-1+" "+nmol[index-1]);}); 
} 
)(i); 

发生了什么事是i是全球性的循环，并通过一次点击事件被触发，i是内内关闭上次迭代的值。

但是，当您将一个函数括在括号中时，您正在有效地进行闭包，从而将变量的范围缩小到括号内。

看到它的工作here