参见英文答案 >
JavaScript closure inside loops – simple practical example39个
我有一些按钮,存储在一个数组中.然后我循环遍历该数组,为每个按钮添加一个click事件.每次单击都会提醒i的值.我希望值为1,2,3等等,但在案例3中它们总是作为一个值返回.
我有一些按钮,存储在一个数组中.然后我循环遍历该数组,为每个按钮添加一个click事件.每次单击都会提醒i的值.我希望值为1,2,3等等,但在案例3中它们总是作为一个值返回.
你能解释为什么会发生这种情况以及如何解决它吗？
请参阅此a jsFiddle.以下代码：
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的值传递给闭包：
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
}
