count=1;
for(var i=0;i<5;i++){
count++;
$("#ImageProductLeft"+count.toString()).bind('click', function(){
alert(i);
});
}
我希望在单击ImageProductLeft1
时显示alert(1)
,单击ImageProductLeft2
时显示alert(2)
,然后...
但是onclick
在所有ImageProductLeft1
上都显示alert(5)
。
5条答案
按热度按时间wfypjpf41#
这是更优雅和灵活一点:
以
ImageProductLeft
开头的元素数量不限,单击任何一个元素都会提醒它们各自的索引。Live test case。
xoefb8l82#
你正在一个循环中创建一个函数(闭包)。所有的变量都将在它们之间共享,也包括
i
。当函数最终被调用时,循环已经结束,
i
的值为5
。JavaScript没有块作用域。要创建新的作用域并捕获变量的值,请调用函数:
这里我们使用一个立即数函数来“捕获”
i
的值。也就是说,当您使用jQuery时,还有其他更优雅的方法来解决这个问题,如@scessor和@ ShadowWizard的答案所示。
尽管如此,了解 * 为什么 * 它是这样工作的以及 * 如何 * 在“纯”JavaScript中解决它是很重要的。
闭包可能很棘手。我建议看一下JavaScript Closures for Dummies。
ryhaxcpt3#
iyr7buue4#
gkn4icbw5#
您遇到这个问题是因为您创建的每个事件处理程序中的
i
都指向内存中的同一个位置。请尝试使用以下代码:这是一个相当常见的错误。请参阅此页以获得进一步的解释