여러 AJAX 요청이 완료된 후에 만 ​​함수를 트리거하십시오.

Question

여러 번 AJAX 요청을 완료 한 후에 한 번 실행하려는 특정 기능이 있습니다.

내 현재 솔루션은 약간 다음과 같습니다 : 위의

function doWork() { 
    //This is the function to be run once after all the requests 
} 

//some tracking/counting variables 
var ajaxDoneCounter = 0; 
var numOfAjaxRequests = 5; 
var workDone = false; 

function doWorkTrigger() { 
    ajaxDoneCounter++; 
    if(!workDone && ajaxDoneCounter >= numOfAjaxRequests) { 
     workDone = true; 
     doWork(); 
    } 
} 

// ... 

//and a number of ajax requests (some hidden within functions, etc) 
//they look something like this: 
$.ajax({ 
    url: "http://www.example.com", 
    dataType: "json", 
    success: function(data) { 
     //load data in to variables, etc 
     doWorkTrigger(); 
    } 
}); 

한 명백한 함정이 성공하지 어떤 AJAX 호출이 ajaxDoneCount를 증가하지 않습니다 그래서 doWork() 아마 호출되지 않을 것입니다. 어떤 $.ajax 안에있는 error 콜백을 사용하여 그걸 해결할 수 있습니다. 너무 걱정하지 않아도됩니다.

내가 알고 싶은 것은 위가 안전한지 또는 좋은 연습인지 여부입니다.
내가 놓친 트릭이나 더 잘 작동 할만한 것이 있습니까?

Answer 1

업데이트 : jQuery 1.5 이후로 deferred objects^[docs]은 더 깨끗한 해결책을 제공합니다. Have a look at an example here.

var numOfAjaxRequests = 5; 

$(document).ajaxComplete(function() { 
    numOfAjaxRequests--; 
    if(!numOfAjaxRequests) { 
     doWork(); 

    } 
}); 

이 그럼 당신은 모든 Ajax 요청을 편집 할 필요가 없습니다 : 완료 Ajax 호출 (성공 또는 오류) 때마다

---

내가 사용하는 것이 .ajaxComplete() , 그것은 트리거됩니다. 당신은 심지어 .ajaxSend()을 사용할 수

은 (어쩌면 당신은 경쟁 조건을 경험하게 될 것입니다하지만 난이 정말 작동하는지 확실하지 않다) Ajax 요청을 시작하는 대신에 그것을 하드 코딩의 알림을받을 수 있습니다 :

var numOfAjaxRequests = 0; 

$(document).ajaxSend(function() { 
    numOfAjaxRequests++; 
}); 

Answer 2

내가 돈 ' 자바 스크립트 내부에 대해 충분히 알고 있지만 조작이 위험 할 수 있습니다.

ajaxDoneCounter++; 

은 원자가 아닙니다. 그렇다면 경쟁 조건이 될 수 있습니다.

Answer 3

성공 (data, textStatus, XMLHttpRequest) 대신 complete(XMLHttpRequest, textStatus) ajax 이벤트를 사용해야한다고 생각합니다. jQuery를 도와 따르면

:

complete(XMLHttpRequest, textStatus) 

함수가 요청 완료 (성공 후 오류 콜백이 실행될) 때 호출된다. 함수에는 두 개의 인수, 즉 이 전달되고 XMLHttpRequest 객체와 요청 상태를 나타내는 문자열이 전달됩니다. 이것은 Ajax 이벤트입니다.