8

jQuery での新しい適切な方法に慣れようとしていますが、元のようにエレガントで DRY な「ライブ」バインディングを行う方法がわかりません。以前は、「ライブ」でこれを行うことができると信じていましたが、要素について一度だけ言及しました。

$("#element_id").live("click",function(){
  //stuff
}).live("mouseover", function(){
  //stuff
}).live("mouseout", function(){
  //stuff
});

さて、$(document).onこれを行う必要があるようです:

$(document).on("click","#element_id",function(){
  //stuff
}).on("mouseover","#element_id",function(){
  //stuff
}).on("mouseout","#element_id",function(){
  //stuff
});

これは簡潔ではなく、要素を繰り返します。これを達成するための明らかに簡単な方法はありますか?

4

2 に答える 2

22
$(document).on({
    click: function () {},
    mouseover: function () {},
    mouseout: function () {}
}, '#element_id');

の使用に注意してくださいdocument。より具体的なセレクターを使用したい場合があります。また、ID 要素を動的にロードすることが必ずしも悪い習慣だとは言いませんが、疑わしいようです。

于 2013-02-06T22:13:13.283 に答える
4

コールバックでコードを共有する必要がある場合、このアプローチが役立つと思います。

var handler = function ( event ) {

    var $target = $( event.target );

    if ( $target.is( '#element_id' ) ) }

        switch ( event.type ) {
            case 'click':
                // stuff
            break;
            case 'mouseenter':
                // stuff
            break;
            case 'mouseleve':
                // stuff
            break;
        }

    }

};

$( document ).on({
    click: handler,
    mouseenter: handler,
    mouseleave: handler,
});
于 2013-02-06T22:19:56.430 に答える