Question

可能重复：
Javascript: closure of loop?

我在javascript中有以下代码：

for (var i=0; i < images_array.length; i++) {
$('#thumb_'+ i).live('click', function(){
    $('#image_container_' + current_image_index).hide();
    current_image_index = i;
    alert(current_image_index);
    $('#image_container_' + current_image_index).show();
});}

当我点击任何拇指时，我得到images_array.length值。有谁知道发生了什么事？

Answer 1

您需要为点击处理函数创建一个闭包，如下所示：

for (var i=0; i < images_array.length; i++) {
    $('#thumb_'+ i).live('click', 
        (function(i) {
            return function(){
                $('#image_container_' + current_image_index).hide();
                current_image_index = i;
                alert(current_image_index);
                $('#image_container_' + current_image_index).show();
            }
        })(i)
    );
}

问题在于，如果没有闭包，变量将在每个处理函数中共享 - 它会继续更新，这就是每个处理程序最终获得array.length值的原因。使用闭包创建变量i的本地范围副本。

这是一个显示差异的演示：

Answer 2

$.each(images_array,function(value,i) {
  $('#thumb_'+ i).live('click', function(){
  $('#image_container_' + current_image_index).hide();
  current_image_index = i;
  alert(current_image_index);
  $('#image_container_' + current_image_index).show();
});}

正如其他人所说，你需要关闭。现在，你已经在使用jQuery，所以忘记for（）并直接使用$ .each。

Jquery在for循环中不起作用

2 个答案: