javascript - 在JS中使用循环索引值

Question

这个问题已经有答案了:

JavaScript closure inside loops – simple practical example (45 个回答)

已关闭 8 年前。

我的 jsp 页面中的 javascript 函数为

<script type="text/javascript">
$(document).ready(function(){
for(i=0; i<20; i++ ) {
$(".plus"+i).click(function(){
    $(".details"+i).slideToggle(500)
    });
}
});

对于每次迭代，我希望输出如下:

.plus0.details0

下一次迭代:

.plus1.details1 等等。但这是行不通的。请帮忙。

Answer 1

控制台不会出现错误。问题是，当 click 处理程序被触发时，for() 循环已经完成，因此 i 将始终等于 19。

您可以使用 jQuery 中的事件数据来规避此行为。您可以按如下方式更新代码:

$(function() {
    for( i = 0; i < 20; i++ ) 
    {
        $('.plus' + i).click( { theIndex : i }, function(e) {
            $('.details' + e.data.theIndex).slideToggle(500)
        });
    }
});