Вызов jQuery ajax в каждом цикле

У меня проблема при использовании jquery .каждый и. технология AJAX() функции. Я употребляю .каждый() в цикле 5 элементов и выполнения .ajax () вызов для каждого из них. Моя проблема в том, что я хочу, чтобы цикл продолжался только тогда, когда ответ был получен от каждого запроса ajax. В настоящее время все 5 элементов зацикливаются, выполняется 5 запросов ajax, затем возвращаются 5 ответов.

ее простой пример:

$(".element").each(function() {
    var id= $(this).find(('txtId').val();
    $.ajax({
       type: "POST",
       url: "/Handlers/Handler.ashx",
       data: "ID=" + id,
       success: function(xml){

         // I would like the each() loop to pause until this is hit, 
         // and some additional logic can be performed. 

       }
     });

});

Ура.

11
each jquery

4 ответов

можно использовать async опция для этого, чтобы сделать каждый запрос синхронным (= остановить выполнение скрипта, пока каждый запрос не будет завершен):

асинхронные По умолчанию, все запросы отправляются асинхронно (т. е. имеет значение true по умолчанию). Если вам нужны синхронные запросы, установите для этого параметра значение false. Междоменные запросы и тип данных: запросы "jsonp" не поддерживают синхронную работу. Обратите внимание, что синхронные запросы могут временно заблокируйте браузер, отключив любые действия, пока запрос активен.

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

было бы лучше изменить архитектуру вашего кода таким образом, что может работать с классическими функциями обратного вызова, если это вообще возможно.

10

Пекка имеет правильный ответ. Вам просто нужно отредактировать сценарий, как показано ниже.

$(".element").each(function() {
    var id= $(this).find(('txtId').val();
    $.ajax({
       type: "POST",
       async: false,
       url: "/Handlers/Handler.ashx",
       data: "ID=" + id,
       success: function(xml){

       }
     });

});
3

Я рад сказать, что есть способ... но это немного противно.

Если вы уверены, что запрос должен что-то вернуть, вы можете удалить часть "tryIteration".

$(document).ready(function() {

        loop(".buttonsPromotion", 0);

});

function loop(elements, tryIteration) {
//HOW MANY TRIES UNTIL WE STOP CHECKING
if(tryIteration<7){

    $(elements).each(function() {            
        var actuel = $(this);
        $.ajax({
           url: "write your link here",
           data: {},
           dataType: 'json',
           async: true,
           success: function(data){
               //HERE WE KNOW THE AJAX REQUEST WENT OK
               actuel.addClass('AjaxOK');    
           },
           error:function(thrownError){
                console.log(thrownError);
                //WE MAKE ANOTHER EACH ON ALL ELEMENT THAT WENT BAD
                var elemToRetry = actuel.not('AjaxOK');
                loop(elemToRetry, ++tryIteration);
            }
         });

    });
}
}
0

вы можете использовать функцию jQuery deffered и promise для проверки успеха асинхронного вызова или нет. http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/

0