Animacja jQuery: Ignoruj ​​podwójne kliknięcie

Question

Mam prostą animację jQuery, która przenosi element div w prawo lub w lewo na zdarzenie .click().

Jednakże, jeśli użytkownik kliknie zdarzenie dwukrotnie, uruchomi się dwukrotnie, co zakłóci formatowanie.

Oto przykład tego, co mam:

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

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

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

    } 
}); 

slide_button function() sprawdza, czy pozycja div jest w dopuszczalnych granicach dla punktu widzenia użytkownika. Jeśli tak, pozwoli to zobaczyć prawy lub lewy przycisk. Jeśli jest poza zakresem, ukryje przyciski.

Działa dobrze, z wyjątkiem sytuacji, gdy kliknę dwa razy - wtedy po prostu zsunie się z tej strony.

Czy można z tym pracować, ignorując podwójne kliknięcia?

Answer 1

Wystarczy sprawdzić, czy element jest już animowanie:

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

Answer 2

Można .unbind() zdarzenie click po kliknięciu którego będzie zapobiec wykonując wielokrotnie:

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

Po zakończeniu animacji można go ponownie powiązać jeśli trzeba, aby móc kliknij ponownie.

Answer 3

normalnie to obejść ustawiając zmienną globalną i uruchomić, jeśli jak

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

Answer 4

Można użyć one() w 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)); 
      } 
     }); 
} 

Po zakończeniu animacji zdarzenie click jest powiązane z li nk ponownie i może być wykonane najwyżej raz.