web-dev-qa-db-ja.com

JQueryでイベントをバインド、バインド解除、および再バインド（クリック）する方法

2週間前に同じ質問をした後 here で、ようやく "the"ソリューションが見つかりました。これが私が自分の質問に答えている理由です。 ;）

JQUERYでイベントをバインド、アンバインド、再バインドする方法

jquerybindunbind
13
John Doe Smith

そして、これは完璧なソリューションです。 （少なくとも私にとっては。）

$(document).on('click', 'a#button', function(){
    $(this).after('<span> hello</span>');
    $('span').fadeOut(1000);
});

$('a#toggle').toggle(
    function(){
        $(this).text('rebind');
        $('a#button').on('click.disabled', false);
    },
    function(){
        $(this).text('unbind');
        $('a#button').off('click.disabled');
    }
);

「.on（）」はそれを行います。注：1行目に表示されるように、イベントをバインドすることが重要です。 .click（）または…では機能しません。

docs を参照してください！

これがフィドルです 試してみて、実験してみてください！

楽しい！

12
John Doe Smith

より簡単で短い解決策は、バインドを解除する場合はオブジェクトにクラスを追加してから、このクラスを削除してexを再バインドすることです。

$('#button').click( function(){
   if($(this).hasClass('unbinded')) return;
   //Do somthing
 });

$('#toggle').click(function(){
    $('#button').toggleClass('unbinded');
 });
3
Wessam El Mahdy