Javascript——在循环中附加事件

Question

这个问题已经有答案了:

已关闭 10 年前。

Possible Duplicate:
adding ‘click’ event listeners in loop

我做了一个演示。所以让我们先看看 HTML。

<a href="#" id="testA">testA</a>
<a href="#" id="testB">testB</a>    

<div id="showA">showA</div>
<div id="showB">showB</div>

我想绑定(bind)click元素事件 a 。当它点击时，alert相关div 。 (点击 id="testA" ，提醒 id="showA" ...)

我编写了 jQuery 代码。

var arr = ["A","B"];    
  for(var i=0;i<arr.length;i++){
    $("#test"+arr[i]).click(function(){
      alert($("#show"+arr[i]).text())
    });
  }

但是这不起作用。我调试这段代码，发现这段代码alert($("#show"+arr[i]).text())

仅当我单击 a 时运行元素 。当我点击a时。变量i是 3已经。

那我该怎么办？

Answer 1

问题是，一旦执行事件处理程序，i 将达到其最终值并停留在 arr.length。您可以使用闭包在循环的每次迭代中捕获 i 的值:

var arr = ["A","B"];    
for(var i=0;i<arr.length;i++) {
    (function (i) {
        $("#test"+arr[i]).click(function(){
            alert($("#show"+arr[i]).text())
        });
    }(i));
}

这是一个working example .