0

重複の可能性:
Javascript: ループの閉鎖?

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 値が取得されます。誰が何が起こっているのか知っていますか？

4

2 に答える 2

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。

違いを示すデモは次のとおりです。

于 2012-12-04T01:44:58.740 に答える
0 
$.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 を使ってください。

于 2012-12-04T01:52:47.090 に答える