jQuery: как вызвать событие, когда все асинхронные вызовы возвращаются?

Question

У меня есть приложение jQuery, которое загружает данные из пяти асинхронных вызовов сервера. Я не хочу отображать какие-либо данные, пока не будут возвращены все пять вызовов. (Я планирую отображать сообщение о загрузке до тех пор, пока это не произойдет.)

Как я могу определить, когда все пять звонков вернулись? Я подумал о том, чтобы каждый метод обратного вызова увеличивал переменную (возможно, с помощью метода jQuery data ()), а затем ожидал, пока значение не станет равным 5. (Я пока не уверен, как бы я слушал это событие.) Я не думаю, что это очень хорошее решение, однако. Что произойдет, если два вызова вернутся одновременно?

Есть ли лучший способ сделать это?

Answer 1

Если вы уже используете JQuery для вызовов AJAX, вы можете использовать для этого $.ajaxStop(), он срабатывает, когда все текущие вызовы возвращаются, вы можете использовать его следующим образом :

$("#loading").ajaxStop(function() {
  $(this).fadeOut();
});

Это не так уж и отличается от .click() в том смысле, что это просто событие, вы можете использовать событие ajaxStop самостоятельно, если хотите, например:

$("#loading").bind('ajaxStop', function() {
  $(this).fadeOut();
});