JQuery - 强制多个ajax请求按顺序运行

时间:2017-05-31 19:03:48

标签: javascript jquery ajax sequence

以下按顺序使用jQuery执行每个ajax调用。呼叫必须按顺序进行。我发现这种方法的唯一方法是使用async:false,我知道这种方式已被弃用且不应使用。下面的代码循环遍历[name]数组中的每个元素,并按顺序触发每个ajax请求。当我删除async:false时,ajax调用是按顺序进行的,有时其中一个似乎根本不会触发。我认为ajaxComplete可能会帮助我,但我没有运气。有没有办法让这些ajax调用按顺序激活?

function doGetJson(name1) { 
    var URL = 'http://some url/?name=' + name1;
    $.ajax({
        url : URL,
        dataType : 'jsonp',
        async: false,
        jsonpCallback : 'getJson',
        name: name1,
        index: i,
        success : handleJson
    });
};

function handleJson(data) {
    <...some other operations...>

};

var name = "test1,test2,test3".split(",");

for (var i = 0; i < name.length ; i++ )
{
    doGetJson(name[i]);
}

1 个答案:

答案 0 :(得分:0)

你应该使用承诺。首先让你的函数返回$.ajax,如下所示:

function doGetJson(name1) { 
    var URL = 'http://some url/?name=' + name1;

    // notice the return !!!
    return $.ajax({
        url : URL,
        dataType : 'jsonp',
        async: false,
        jsonpCallback : 'getJson',
        name: name1,
        index: i,
        success : handleJson
    });
};

然后你把它们链接起来:

var name = "test1,test2,test3".split(",");

var promise = name.slice(1)
    .reduce( (a,b) => a.then(doGetJson.bind(null, b))
       , doGetJson(name[0]) )

promise.then(function(){
    // do something when all requests are ready
})