Решая задачи с использования 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]);