jQuery previene altri eventi dopo un clic

Question

Sto tentando di impedire più clic su collegamenti e voci, che causano problemi.

Sto utilizzando jQuery per associare eventi di clic ai pulsanti (interfaccia utente di jQuery) e collegamenti alle immagini (<a><img /></a>).

C'è un modo per evitare una volta per tutte gli altri eventi di attivazione dopo un clic?

Oppure è necessario mantenere una variabile globale denominata _isProcessing e impostarla su true per ogni gestore di eventi?

Grazie

Edit: (chiarimento) Grazie per le vostre risposte, il mio problema non impedisca il gorgogliare della manifestazione, ma evitando gli scatti multipli simultanei.

Answer 1

Esistono vari modi per impedire ai clic di eseguire il codice in concomitanza.

Un modo è quello di unbind('click') sull'elemento, quindi .bind() di nuovo quando sei pronto.

Preferisco usare una sorta di bandiera. Potrebbe essere una variabile, ma preferirei assegnare una classe all'elemento, come .processing, e rimuoverlo quando è fatto. Quindi si dovrebbe controllare il gestore dell'esistenza di quella classe per determinare che il codice debba essere eseguito.

$('someElement').click(function() { 
    var $th = $(this); 
    if($th.hasClass('processing')) 
      return; 
    $th.addClass('processing'); 
    // normal code to run 
    // then when done remove the class 
    $th.removeClass('processing'); 
}); 

Un'altra opzione è quella di utilizzare gli elementi .data() per impostare una bandiera simile, come $(this).data('processing', true); quindi impostarla su false quando fatto.

Answer 2

hai verificato preventDefault?

$("a").click(function(e) { 
    e.preventDefault(); 
} 

si potrebbe anche provare stopImmediatePropagation() o stopPropagation()

---

Si potrebbe anche prendere in considerazione l'evento one().

Collegare un gestore a un evento per gli elementi . Il gestore viene eseguito a più una volta per elemento.

Answer 3

Restituire false dai gestori di eventi o chiamare ev.stopPropagation() in ogni gestore.

Answer 4

C'è event.preventDefault, event.stopPropagation e restituisce falso come già dichiarato.

$("a").click(function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    return false; 
} 

Answer 5

hai un paio di opzioni:

1. Se i pulsanti/link vi ricaricare pagina, si può semplicemente separare il gestore di eventi click:

   $('input:submit').click(fumction() { 
       $(this).unbind('click'); 
       // Handle event here 
   }) 
   

2. È puoi disabilitare i pulsanti e riattivarli una volta terminato (penso che funzioni anche con <input type="image">):

   $('input:submit').click(function() { 
       $(this).attr('disabled', 'disabled'); 
       // It also helps to let the user know what's going on: 
       $(this).val('Processing...'); 
       // Handle event here 
       $(this).removeAttr('disabled'); 
   }) 
   

   Non penso che questo funziona sui collegamenti però.

Answer 6

Un altro modo sarebbe usare event.stopPropagation() e event.isPropagationStopped() di segnalazione:

Esempio:

$(button).click(function(e){ 
    if(e.isPropagationStopped()) 
     return; // propagation was stopped, so stop further execution 

    // if you got this far - this event handler was called first 
    // custom logic goes here 

    // stop event propagation to signal other handlers 
    e.stopPropagation(); 

    // if you need, call e.preventDefault() to prevent default behaviour 
}); 

Ripetere stessa logica per altri gestori di eventi.