2010-01-28 2 views
2

사용자가 jQuery의 $ .ajax를 사용하여 콘텐츠를로드하기 위해 클릭 할 수있는 몇 가지 버튼이 있습니다. 모든 버튼은 동일한 div 태그에 내용을로드합니다. 문제는 사용자가 여러 번 빠르게 클릭하면 콘텐츠가 올바른 콘텐츠에 착륙하기 전에 여러 번 깜박일 수 있다는 것입니다.jQuery Ajax SyncLock

이 문제를 해결할 수있는 방법은 무엇입니까? 나는 .net의 SyncLock 기능과 비슷한 것을 생각하고 있었지만, javascript/jQuery에서는 생각했다. 이상적인 해결책은 현재 대기열에있는 요청을 취소하고 새 대기열을 시작하는 것입니다.

한 가지주의해야 할 점은 여러 개의 관련없는 Ajax 요청이 진행될 수 있으므로 모든 요청을 지울 수 없다는 것입니다.이 요청은이 div 태그와 관련이 있습니다.

답변

6

요청을 지우거나 취소하는 것은 비용이 많이 드는 작업이므로 필요하지 않습니다. 또한 서버 측에서 실행을 멈추지 않고 httprequest를 닫을 수도 있습니다.

"잠금"을 설정하고 이에 따라 잠금을 설정하고 잠금을 해제하십시오. 뭔가 같이 : 버튼에서

var working = false; 

function startAjax() { 
    working = true; 
    // do ajax and wait for callback() 
} 

function callback() { 
    working = false; 
} 

) (.click 수 있도록 실제 실행하기 전에 작업하는 경우 확인하십시오 :

$("#thebutton1, #thebutton2").click(function() { 
    if(working) { 
     alert("Im in the middle of something"); 
    } else { 
     // execute... 
    } 
}); 
+0

요청이 이미 실행되고 있음을 사용자에게 알릴 수 있기 때문에 접근 방식이 좋습니다. –

+1

잠금 플래그 변수를 설정하기 위해 .ajax 호출에서 beforeSend 함수를 사용했으며 잘 작동했습니다. –

+0

beforeSend가 작동해야하며 호출 코드도 약간 정리해야합니다. 좋은 지적! – Ariel

0

당신이 할 수있는 것은 출력을 보내는 모든 버튼의 클릭 이벤트를 가지고 동일한 div에 버튼을 비활성화하십시오. 그런 다음 AJAX 콜백에서 일단 응답을 처리하면 모두 다시 활성화 할 수 있습니다.