关于javascript：在循环中添加带有参数的事件监听器


add event listener with argument in a loop

本问题已经有最佳答案，请猛点这里访问。

我通过以下方式动态创建带有单击事件的按钮：

1
2
3
4
5
6
7
8
9
10
//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。

谁能解释我为什么？

谢谢

相关讨论

修改它，以便在循环中有一个内部闭包

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

发生的事情是i是循环的全局，并且随着时间的推移触发了click事件，i是最后一次迭代的值。

但是，当您将一个函数括在括号中时，您实际上是在创建一个闭包，它将变量的范围缩小到括号内。

看到它在这里工作

相关讨论