关于javascript：为什么来自我的循环的警报总是返回最后一个值，而不是每个迭代值？


Why does the alert coming from my loop always return the last value, not each iteration value?

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

我有一些按钮，存储在一个数组中。 然后我循环遍历该数组，为每个按钮添加一个click事件。 每次单击都会提醒i的值。 我希望值为1，2，3等等，但它们总是以一个值的形式返回，以防3。

你能解释为什么会发生这种情况以及如何解决它吗？

请看这个jsFiddle。 代码如下：

1
2
3
4
5
6
7
var theButtons = ['.button.one', '.button.two', '.button.three'];

for (i=0; i<theButtons.length; i++) {
    $(theButtons[i]).click(function () {
        alert(i); // always returns 3
    });
}

请尽可能简单明了地解释它 - 我有点像Javascript和编程的初学者。

相关讨论

当您单击按钮i === 3时。需要将i的值传递给闭包：

1
2
3
4
5
6
7
for (var i = 0; i<theButtons.length; i++) { // do `var i` so the i is not global
    (function(index){
        $(theButtons[i]).on('click', function () {
           alert(index); // index === the value that was passed
        });
    })(i); // pass the value of i
}

小提琴演示：http：//jsfiddle.net/maniator/fE55Y/3/

相关讨论

只需使用EACH方法：

1
2
3
4
5
$(".button" ).each(function( index ) {
    $(this).click( function(e){
        alert( index +":" + $(this).text());
    });
});

小提琴：http：//jsfiddle.net/fE55Y/4/

更新：

同意所要求的内容不需要.each()。这是不使用.each()方法的那个。

1
2
3
$(".button").click(function () {
    alert("Button Index:" + $(this).index());
});
相关讨论

欢迎使用异步编程和全局变量！

你在这里看到的问题是因为在这种情况下i被全局声明，因为任何地方都可以从任何地方访问。

那么，执行脚本时会发生什么：

  • 循环遍历类名数组
  • 在每次迭代中，将单击绑定到匹配节点，调用您提供的匿名函数

这里的问题是你提供的函数是在你的循环之外执行的(例如，当点击发生时)，所以i的值是最后一次迭代中的值，在这种情况下2

相关讨论