Come associare, slegare e riassociare eventi (clic) in JQuery

Question

Dopo aver posto la stessa domanda 2 settimane fa here, ho finalmente trovato la "soluzione". Questo è il motivo per cui sto rispondendo alla mia stessa domanda. ;)

COME BIND, UNBIND E REBIND EVENTI IN JQUERY?

Answer 1

E QUESTA è la soluzione perfetta. (Almeno per me.)

$(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()" lo fa. NOTA: è importante associare l'evento come puoi vedere sulla prima linea! Non funziona con .click() o ...!

Vedere il docs!

Here is a fiddle per provarlo e sperimentarlo!

Divertiti!

Answer 2

Questa funzione estende jQuery per includere un operatore che allega gestori di eventi uguali a .on. Inoltre impedisce più di una singola istanza di un dato gestore di essere collegato al selettore (s).

Tenere presente che la rimozione e il ricollegamento dei gestori di eventi modifica l'ordine in cui sono collegati.

(function ($) { 
    $.fn.reBind = function(events, handler) { 
     return this.off(events, handler).on(events, handler); 
    }; 
}(jQuery)); 

Answer 3

Una soluzione più semplice e breve è quello di aggiungere una classe per l'oggetto se si vuole separare poi rimuovere questa classe per associare nuovamente ex;

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

$('#toggle').click(function(){ 
    $('#button').toggleClass('unbinded'); 
});