В jquery, как я могу отслеживать несколько запросов AJAX, вызванных из одной функции

Question

Я использую jquery и в одной функции я вызываю несколько функций, которые делают разные запросы ajax, например

function contactForm(){
loadCountryList();
loadMyData();
checkUserType();

// doing my stuff

}

Как я могу узнать, завершены ли все запросы ajax, чтобы я в конце концов начал делать свои вещи? Я не хочу звонить им один за другим, чтобы минимизировать время запроса. любое предложение мне очень поможет.

Answer 1

Здесь вы можете использовать глобальные обработчики ajax , в частности .ajaxStop(), например:

$(document).ajaxStop(function() {
  alert("All requests have completed!");
  //if you don't want to run it again, for example on future requests
  //then just unbind it like any other event :)
  $(this).unbind('ajaxStop');
});

Вы также можете использовать его непосредственно для элемента, который вы хотите показать, например:

$("#successDiv").ajaxStop(function() {
  $(this).fadeIn();
});

Обработчик .ajaxStop() (это просто событие) запускается, когда все запросы заканчиваются, а не после каждого.

Answer 2

// something like this

var countriesLoaded = false;
var dataLoaded = false; 
var userTypeChecked = false; 
var didRestOfStuff = false;

function readyForNextStage() {
  return countriesLoaded && dataLoaded && userTypeChecked;
}

// after you get a complete on each ajax callback 
countriesLoaded = true; // or dataLoaded and so on
if (readyForNextStage() && !didRestOfStuff) {
  didRestOfStuff = true;
  // do rest of stuff
}