jQuery animazione: Ignora doppio clic

Question

Ho una semplice animazione jQuery che sposta un div a destra o a sinistra, su un evento .click().

Tuttavia, se l'utente fa clic due volte sull'evento, viene attivato due volte, il che compromette la formattazione.

Ecco un esempio di ciò che ho:

$('a#right').click(function() { 

if ($(this).is(':visible')) { 

    $('#slide').animate({right: '+=257'}, 400, function() { 
    slide_button(); 
    }); 

    } 
}); 

La funzione slide_button() si controlla se la posizione del div è entro limiti accettabili per punto di vista dell'utente. Se è così, permetterà che il pulsante destro o sinistro sia visibile. Se è fuori dai limiti, nasconderà i pulsanti.

Funziona bene, eccetto se lo clicco due volte, quindi si sposterà appena fuori dalla pagina.

C'è un modo per lavorare con questo per ignorare i doppi clic?

Answer 1

Basta verificare se elemento è già animando:

$('a#right').click(function() { 
    if ($(this).is(':visible') && !$('#slide').is(':animated')) { 
     $('#slide').animate({right: '+=257'}, 400, function() { 
      slide_button(); 
     }); 
    } 
});  

Answer 2

Si potrebbe .unbind() l'evento click, una volta cliccato, che gli impedirà di eseguire più volte:

$('a#right').click(function() { 
    $(this).unbind('click'); 
    ... 
}); 

Una volta completata l'animazione si potrebbe associare nuovamente che se avete bisogno di essere in grado di fare di nuovo clic.

Answer 3

normalmente aggirare questo impostando una variabile globale ed eseguire una se come

clicked = true; 
$(div).click(function(){ 
    if (!clicked){ 
     clicked = true; 
     Your function with a callback setting clicked to false 
    } 
    .... 
}) 

Answer 4

È possibile utilizzare one() in jQuery:

$('a#right').one("click", function() { 
    slide($(this)); 
}); 

function slide(obj) { 
    if (obj.is(':visible')) { 
     $('#slide').animate({right: '+=257'}, 400, function() { 
      slide_button(); 
      $('a#right').one("click", function() { 
       slide($(this)); 
      } 
     }); 
} 

Al termine dell'animazione, l'evento click è associato a li di nuovo nk e può essere eseguito al massimo una volta.