Как управлять порядком функций, вызываемых в jQuery $ (document) .ready

Question

Мне нужно иметь возможность контролировать порядок обработки элементов в событии $(document).ready.
Это несколько элементов управления, загружаемых из нескольких файлов, все из которых требуют вызова в событии ready. Все они запускают асинхронный вызов на сервер (AJAX). Только после того, как все сделано, мне нужно сделать дополнительную работу.

Что было бы изящным решением для этого?

Answer 1

Асинхронные запросы пожар по порядку, но возвращаются в любом порядке, в котором они заканчиваются в первую очередь. Таким образом, нет уверенного способа пожара, чтобы заставить их закончить одновременно, однако вы можете создавать правила только для запуска кода после возвращения определенных групп.

Например, определите функцию обратного вызова с набором правил и передайте ее каждому обратному вызову для всех ваших запросов ajax.

var completedObject = {}; 

function groupSuccessCallback() { 
    // Test for any combination of requirements 
    if (completedObject.ajax1 && completedObject.ajax2) { 
    ... // Do something that only requires 1 and 2 
    } 
    if (completedObject.ajax1 && completedObject.ajax2 && completedObject.ajax3) { 
    ... // Do something that requires all 3 being done 
     // your data is available at completedObject.ajax# 
    } 

    // Or test for _all_ entries for a dynamic count 
    var allComplete = true; 
    for(var i in completedObject) { 
    if (completedObject.hasOwnProperty(i) && !completedObject[i]) { 
     allComplete = false; 
    } 
    } 

    // Do whatchya need. 
    if (allComplete) { 
    alert("bb-b-bb-b-b-b-bbb... that's all folks!"); 
    } 
} 

Затем установите флаги внутри ваших функций успеха:

// Ajax1 
completedObject['anything'] = false; // instantiate a dynamic entry in the object or use an array if you can't use names. 
$.ajax({ 
    ..., 
    ..., 
    success: function(data) { 
    completedObject['anything'] = data || true; 
    groupSuccessCallback(); 
    } 
}); 

Answer 2

В зависимости от остальной части страницы выполнение «дополнительной работы» в обработчике $.ajaxStop может быть более изящным вариантом.

Однако было бы нецелесообразно, если пользователь сможет и/или может инициировать последующие вызовы $ .ajax() , а - это начальные вызовы. В этом случае их вызванные вручную вызовы могут продлить событие $ .ajaxStop дальше, чем предполагалось.

Answer 3

Создайте переменную, которая содержит значение 0. В функции успеха каждого увеличения Ajax увеличивайте это значение на 1 и проверьте, соответствует ли это значение вашему общему числу вызовов, если оно выполняет функцию полного завершения.

Answer 4

Резиг на функции порядка оценки в $ (документ) .ready:

Каждый раз, когда новая функция добавляется в очередь, это просто добавляется в массив - то быть совал снова отпустите при выполнении. Дайте мне знать, если это не для вас.

$ .readyList - только в предварительно 1,4 версии

JQuery разоблачили свойство $.readyList, которое представляет собой массив, чтобы функция orded манипуляции, однако $.readyList in no longer publicly exposed in jQuery 1.4.0

Hackerish путь

вы можете попробовать $(window).load(function() {});, он должен выполняться после того, как все окно загрузилось (не когда документ готов, так как это с $(document).ready()