0

クリックイベントで処理したい番号付き ID を持つ div があります。

$(function() { 
    for (var i = 1; i != 10; ++i) {
       $("#div" + i).live('click', function () {
           //...
           console.log(i); // always prints 10
       });
    }
});

// html
<div id="div1">...</div>
<div id="div2">...</div>
etc.

各 div のクリック イベントが独自のイベント ハンドラーを起動することを期待していました。しかし、そうではありません。

修正してください。

4

4 に答える 4

1

クロージャーの使用:

$(function () {
    for (var i = 1; i < 11; i++) {
        (function (i) {
            $("#div" + i).live('click', function () {
                //...
                console.log(i); // always prints 10
            });
        }(i));
    }
});

ただし、jquery のバージョンによっては、代わりに .on() (委譲) または .delegate() メソッドをセレクターとして使用できます。'[id^=div]'

于 2013-08-06T19:06:23.267 に答える
0 
$(function() { 
    $("div[id^=div]").click( function(){
        var id = $(this).attr('id').replace('div', '');
        console.log(id);
    });
});

クリックをチェックするこの方法は、はるかにコンパクトで簡単であることがわかります.i変数が固執している理由についてはすでに回答がありますが、適切と思われる方法を自由に使用してください.

于 2013-08-06T19:11:01.797 に答える
0

ライブ イベントはループの終了後に呼び出されるため、ループは最後の値を保持しています。次のように、ループ内でライブ イベントに値を渡す必要があります。

$(function() { 
    for (var i = 1; i != 10; ++i) {
        $("#div" + i).live('click', {i: i}, function (e) {
            //...
            console.log(e.data.i); // prints correct value
        });
    }
});
于 2013-08-06T19:09:21.240 に答える