In jQuery, esiste un modo per associare solo un clic una volta?

Question

Ho un'app ajax che eseguirà funzioni su ogni interazione. Mi piacerebbe essere in grado di eseguire la mia funzione di installazione ogni volta in modo che tutto il mio codice di installazione per quella funzione rimane incapsulato. Tuttavia, elementi vincolanti più di una volta significa che il gestore verrà eseguito più di una volta, il che è ovviamente indesiderabile. C'è un modo elegante in jQuery per chiamare il bind su un elemento più di una volta senza che il gestore venga chiamato più di una volta?

Answer 1

Si potrebbe collegare l'evento per document con la funzione one():

$(document).one('click', function(e) { 
    // initialization here 
}); 

Una volta eseguito, questo gestore di eventi viene rimossa in modo che non verrà eseguito di nuovo. Tuttavia, se hai bisogno dell'inizializzazione per eseguire prima dello l'evento click di qualche altro elemento, dovremo pensare a qualcos'altro. L'utilizzo di mousedown invece di click potrebbe funzionare in seguito, poiché l'evento Mousedown viene generato prima dell'evento click.

Answer 2

User jQuery one funzione come Tom ha detto, ma separare il gestore ogni volta prima di legare nuovamente. Aiuta ad avere il gestore di eventi assegnato a una variabile rispetto all'utilizzo di una funzione anonima.

var handler = function(e) { // stuff }; 

$('#element').unbind('click', handler).one('click', handler); 

//elsewhere 
$('#element').unbind('click', handler).one('click', handler); 

Si può anche fare .unbind('click') per rimuovere tutti i gestori di click allegati a un elemento.

Answer 3

La risposta di Chetan Sastry è ciò che desideri. Fondamentalmente basta chiamare $ (elemento) .unbind (evento); prima di ogni evento.

Quindi, se si dispone di una funzione come loadAllButtonClicks() che contiene tutti i metodi

$(element).on("click", function(){}); 

per ciascun pulsante sulla tua pagina, e si esegue che ogni volta che un tasto è scattato, questa sarà ovviamente produrre più di un evento per ogni pulsante. Per risolvere questo problema è sufficiente aggiungere

$(element).unbind(event); 

prima di ogni

$(element).on("click", function(){}); 

e sarà separare tutti gli eventi a quell'elemento, poi aggiungere l'evento uno scatto.

Answer 4

Puoi anche usare .off() se unbind non fa il trucco. Assicurarsi che il selettore e l'evento dato a .OFF corrispondono esattamente a quelli inizialmente previsti per .ON():

$("div.selector").off("click", "a.another_selector");  
$("div.selector").on("click", "a.another_selector", function(e){ 

Questo è ciò che ha funzionato per me per risolvere lo stesso problema ajax ricaricare.