Решая задачи с использования javascript часто необходимо использовать запросы к серверу (ajax). Иногда необходимо делать несколько запросов сразу, что приводит к выстраиванию данных запросов в очередь, так как, как правило, сервер может обрабатывать запросы с клиента по одному. Причем порядок запросов будет произвольный. Я расскажу Вас как выполнить набор ajax запросов так, чтобы они выполнились по очереди в указанном порядке.
Допустим у нас есть набор функций f1, f2, f3 которые отсылают ajax запрос на сервер
function f1() {
$.ajax({url: '/'});
}
function f2() {
$.ajax({url: '/'});
}
function f3() {
$.ajax({url: '/'});
}
Для того чтобы реализовать необходимый функционал нам необходимо немного модернизировать наши функции, добавив новый аргумент. Данным аргументом будет функция, которая будет вызываться на событие complete.
function f1(callback) {
callback = callback || function() { };
$.ajax({
url: '/',
complete: function() {
if(typeof(callback) === 'function') {
callback();
}
}
});
}
//остальные функции аналогично
Теперь нам необходимо реализовать функцию, которая будет вызывать наши функции в нужном порядке.
function callAjaxFunctions(order, index) {
index = index || 0; //служебная переменная
if(index < 0 || index >= order.length) {
return;
}
order[index](function() {
callAjaxFunctions(order, index + 1);
});
}
Теперь для того чтобы вызвать функции, описанные выше, например, в порядке f2, f1, f3 достаточно написать следующую строчку:
callAjaxFunctions([f2, f1, f3]);