Animasyon devam ederken birden fazla tıklamayı engelle (stopPropagation &: animasyonlu)

Question

Bu cevapları okuduktan ve takip ettikten sonra soruyorum. Yer hızlı tıklama balonunda e.stopPropagation(); ve if ($element.is(':animated')){return false;} olmasına rağmen

how to prevent click queue build up, using toggle in jquery? tried using bind/unbind('click')

jQuery prevent multiple clicks until animation is done
.

Here benim keman. Yavaş tıklamalar iyi çalışır, hızlı tıklamalar başarısız olur. Neyi yanlış yapıyorum lütfen? Menü öğeleri canlandırılırken tüm hızlı tıklamaları nasıl atabilirim?

Answer 1

Kodunuz sağlamdı, ancak animasyonu denetlemeden ÖNCE sınıfını ekliyordunuz.

Animasyon kontrolünü basitçe hareket ettirdim ve tıklamanın sınıfı bile değiştirmesini engelledim.

ile

// jQuery 1.11.0 on DOM ready 

var $hamburgerMenuButton = $('#burgerButton'); 
var $navTitle = $('.navigation-item'); 
var $score = $('.score'); 

$hamburgerMenuButton.click(function(e) { 

e.stopPropagation(); 

    if (!$hamburgerMenuButton.hasClass('open')) {   

     console.log('hamburgerMenuButton does NOT have class open'); 
     if ($navTitle.is(':animated')) { 
     $score.append('<br>animating '); 
       return false; 
      } 
     $hamburgerMenuButton.addClass('open'); 
     console.log('class open ADDED to hamburgerMenuButton'); 
     $score.append('<br>class open ADDED '); 


      var delay = 0; 
      $navTitle.each(function(){ 
       $(this).delay(delay).animate({ 
        'margin-left':'0px' 
       },500,'easeOutQuint'); 
       delay += 33; 
      }); // animation end 

     $score.append('<br>clicked '); 

    } // if end 

    else { 

     console.log('hamburgerMenuButton does HAVE class open'); 
      if ($navTitle.is(':animated')) { 
     $score.append('<br>animating '); 
       return false; 
      } 
     $hamburgerMenuButton.removeClass('open'); 
     console.log('class open REMOVED from hamburgerMenuButton'); 
     $score.append('<br>class open REMOVED '); 



      var delay = 0; 
      $navTitle.each(function(){ 
       $(this).delay(delay).animate({ 
        'margin-left':'10em' 
       },500,'easeOutQuint'); 
       delay += 33; 
      }); // animation end     

     $score.append('<br>clicked again'); 

    } // else end    
}); // $hamburgerMenuButton click end 

https://jsfiddle.net/gregborbonus/b2tw65hf/3/