이벤트가 끝날 때까지 jQuery 이벤트 리스너 사용 안 함

Question

네 개의 탭이 있습니다. 그 중 하나는 기본적으로 활성화되어 있습니다. 비활성 탭을 클릭하면 탭이 확장되고 활성 탭이 축소됩니다.

내가 가지고있는 문제는 애니메이션 중에 비활성 탭을 클릭했을 때의 문제입니다.

$(document).ready(function(){ 
    $('.tab').bind('click',function(){ 
     if(!$(this).hasClass('activetab')){ 
      $('.activetab').removeClass('activetab',500); 
      $(this).addClass('activetab',500); 
     } 
    }); 
}); 

http://jsfiddle.net/wFHBR/

나는 애니메이션 스태킹 질문에 모든 시간을 묻는하지만이 특정 예에 대한 해결책을 찾을 수 없습니다 알고있다.

애니메이션을 정지, 되돌리기 또는 대기시키기를 원하지 않습니다. 애니메이션이 아직 진행중인 경우 다른 탭의 모든 클릭을 완전히 무시하기 만하면됩니다.

감사합니다.

Answer 1

현재 애니메이션 상태인지 여부를 나타내는 전역 변수를 추가하십시오. click 처리기의 시작 부분에 true으로 설정하고 애니메이션 메소드 콜백 중 하나에서 false으로 되돌립니다. 그리고 확인해보고 click 처리기 안에 들어가야하는지 결정하십시오. 난 그냥 CSS 애니메이션이 클래스를 만드는 대신에 jQuery를하여 클래스를 애니메이션으로 완전히 왜 u는이를 방지하지 않습니다 당신은 예를 들어 http://jsfiddle.net/vSWdS/

var currently = false; 
$('.tab').bind('click',function(){ 
    if(!$(this).hasClass('activetab') && !currently){ 
     currently = true; 
     $('.activetab').removeClass('activetab',500); 
     $(this).addClass('activetab',500, "swing", function(){ 
      currently = false; 
     }); 
    } 
});