Question

我在使用jquery .each（）和.ajax（）函数时遇到了问题。我正在使用.each（）循环遍历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. 

       }
     });

});

干杯。

Answer 1

您可以使用async选项使每个请求同步（=在每个请求完成之前暂停脚本执行）：

<强>异步默认情况下，所有请求都是异步发送的（默认情况下设置为true）。如果需要同步请求，请将此选项设置为false。跨域请求和dataType：“jsonp”请求不支持同步操作。请注意，同步请求可能会暂时锁定浏览器，并在请求处于活动状态时禁用任何操作。

但是，正如文档已经说过的那样，这是非常气馁的，因为如果请求挂起或超时，它可能会冻结浏览器。

如果可能的话，最好以可以使用经典回调函数的方式更改代码的体系结构。

Answer 2

佩卡有正确的答案。您只需编辑脚本，如下所示。

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

       }
     });

});

Answer 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);
            }
         });

    });
}
}

Answer 4

您可以使用jquery延迟和promise函数来检查异步调用是否成功。 http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/

Answer 5

虽然已经晚了，但我为此使用了一个解决方法我创建了一个函数来通过传递元素来处理 ajax 请求

A <- spMatrix(ncol = length(unique(food_prefs$person)),
              nrow = length(unique(food_prefs$food)),
              j = as.numeric(factor(food_prefs$person)),
              i = as.numeric(factor(food_prefs$food)),
              x = rep(1, nrow(food_prefs)))
rownames(A) <- levels(factor(food_prefs$food))
colnames(A) <- levels(factor(food_prefs$person))

adj <- A %*% t(A)
food_pairs <- data.frame(food1=rownames(adj)[row(adj)],food2=colnames(adj)[col(adj)],num_joint=as.numeric(adj))
food_pairs <- food_pairs[food_pairs$food1 != food_pairs$food2, ]
head(food_pairs)
# food1 food2 num_joint
# 2   F10    F1        23
# 3  F100    F1        26
# 4 F1000    F1        25
# 5 F1001    F1        19
# 6 F1002    F1        27
# 7 F1003    F1        34

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

$(".element").each(function() {
    // run the ajax function for current element
    ajax_request($(this));
});

希望它可以帮助任何人做类似的事情

在每个循环中调用Jquery ajax

5 个答案: