더블 클릭 방지 (onclick 없음)

Question

@goddfree가 게시 한 내용을 잘못 읽었습니다. ,

$.when($('#carousel_ul_' + unique_id + ' li:last').clone().insertBefore('#carousel_ul_' + unique_id + ' li:first'), $('#carousel_ul_' + unique_id).css('left', '-=' + displace_width + 'px')).done($('#carousel_ul_' + unique_id + ':not(:animated)').animate({left: '+=' + scroll_width + 'px'}, 400, function(){$('#carousel_ul_' + unique_id + ' li:last').remove(); is_done = true; })); 

이 정말 우아한 해결책은 당신이

Answer 1

을 @goddfree 감사 : 그의 해결책은 내가 참으로 다시의 isDone을 ​​설정하는 것은 그래서 같은 애니메이션 기능의 콜백에 배치되는 것을 만든 유일한 변화, 완벽하게 작동 HTML 앵커 태그에는 onClick 이벤트가 있습니다. 이런 식으로 해봤 니? 여기에서 발견 한 솔루션을 사용할 수 있어야합니다.

<a href="#" onclick='carousel("left", 99335)'><!--stuff here--></a> 

업데이트 :

내가이 당신을 위해 무엇을 찾고있는 것 같아요. 우리는 어떤 프로세스가 실행 중인지 여부를 확인하기 위해 isDone라는 변수를 추가

<a href="#" onclick='carousel("left", 99335)'>Button 1</a> 
<a href="#" onclick='carousel("right", 69235)'>Button 2</a> 
<a href="#" onclick='carousel("left", 91235)'>Button 3</a> 

: 당신은 세 개의 버튼이 있다고 (난 그냥 carousel 매개 변수를 만들고있어, 나는 그들이 무슨 뜻인지 단서가 없다). 모든 버튼이 같은 carousel 함수를 호출하기 때문에 isDone가 true로 설정되어있는 경우, 그들은 단지 실행됩니다,

//isDone is initially set to true, because nothing is running. 
var isDone = TRUE; 

function carousel(direction, unique_id) { 
//First of all, we can only execute the function is isDone is true. So we check for that: 
if(isDone) { 
//This implements the moment the function is called. We now know that it is currently in progress. 
isDone = FALSE; 
//This is the same as you had before 
if (direction == 'right') { 
    $(document).ready(function(){ 
     var displace_width = $('#carousel_ul_' + unique_id + ' li:last').outerWidth(true); 
     var scroll_width = $('#carousel_ul_' + unique_id + ' li:first').outerWidth(true); 
     //Here we set isDone equal to true when the .done is called: 
     $.when($('#carousel_ul_' + unique_id + ' li:last').clone().insertBefore('#carousel_ul_' + unique_id + ' li:first'), $('#carousel_ul_' + unique_id).css('left', '-=' + displace_width + 'px')).done(isDone = TRUE; $('#carousel_ul_' + unique_id + ':not(:animated)').animate({left: '+=' + scroll_width + 'px'}, 400, function(){$('#carousel_ul_' + unique_id + ' li:last').remove(); })); 
    }); 
} else { 
    $(document).ready(function(){ 
     var displace_width = $('#carousel_ul_' + unique_id + ' li:first').outerWidth(true); 
     var scroll_width = $('#carousel_ul_' + unique_id + ' li:nth-child(2n)').outerWidth(true); 
     //Same thing here 
     $.when($('#carousel_ul_' + unique_id + ' li:first').clone().insertAfter($('#carousel_ul_' + unique_id + ' li:last'))).done(isDone = TRUE; $('#carousel_ul_' + unique_id + ':not(:animated)').animate({left: '-=' + scroll_width + 'px'}, 400, function(){$('#carousel_ul_' + unique_id + ' li:first').remove(); $('#carousel_ul_' + unique_id).css('left', '+=' + displace_width + 'px'); })); 
    }); 
} 
} 
//If isDone is not true, then we tell the user that and don't execute anything: 
else { 
    alert("Not so fast! There is a process currently in progress."); 
} 
} 

이 방법 : 그래서 같은 carousel 함수를 수정 (I 주석을 사용하여 수정 사항을 설명). 그렇지 않으면 사용자에게 오류 경고가 표시되고 아무 것도 나타나지 않습니다.