0

私がこのコードを持っているとしましょう：

$('.mask-preview:not(.selected)').click(function () {
    $('.mask-preview.selected').removeClass('selected');
    $(this).addClass('selected');
    console.log("added");
});

現在、class="mask-preview selected"このハンドラーを持つ要素は呼び出されません。なしの要素で呼び出すとselected、ハンドラーが呼び出され、クラスが追加されます。

しかし今でも、selectedが追加されている場合でも、その要素でそのハンドラーを呼び出すことができます。実際、「ハンドラー」はDOMに「更新」されていません。これを動的に行う方法はありますか？

毎回チェックするのをやめますif(element.hasClass())

4

3 に答える 3

1

バインディングは1回だけ発生し、要素を変更しても変更されません。

コールバック内のクラスをチェックするのが最も簡単です。

$('.mask-preview').on('click', function() {
    if ($(this).hasClass('selected')) {
        ...
    } else {
        ...
    }
});

.onのセレクターは子孫にのみ適用され、登録された要素自体には適用されないことを指摘するコメントのおかげで、この回答を更新して編集してください。

于 2012-10-19T12:58:14.533 に答える
0

このようなもの？

$('#mask-preview').click(function () {
    if ( !$(this).hasClass('selected') ) {
        $(this).addClass('selected');
        console.log("added");
    } else {
        $(this).addClass('not_selected');
        console.log("added");
    }
});
于 2012-10-19T13:02:16.880 に答える
0

.liveこれであなたを助けることができるかもしれません

$('.mask-preview:not(.selected)').live('click',function () {
    $('.mask-preview.selected').removeClass('selected');
    $(this).addClass('selected');
    console.log("added");
});​

ライブデモ

于 2012-10-19T13:08:45.373 に答える