等到所有jquery ajax请求都完成了? (第2部分)

时间:2013-10-24 17:11:04

标签: jquery ajax promise jquery-deferred .when

我查了这篇文章,答案非常好: Wait until all jQuery Ajax requests are done?

但我只想更通用: 我想知道如何将这个逻辑用于服务列表(ajaxservices)和回调列表,例如。

ajaxservices = ["url-getdata1", "url-getdata2"];
callbacks = [callbackdata1, callbackdata2];
callbackdata1 = function (data){...}

$.when(/*somehow call all ajaxservices[]*/).done(function (dataList) {
            for (var i = 0; i < callbacks.length; i++) {
                callbacks[i](dataList???[i][0]);/* somehow pass the data as parameter*/
            }

        });

谢谢!

更多信息:http://api.jquery.com/jQuery.when/

2 个答案:

答案 0 :(得分:1)

不要使用eval,而是使用一组参数来调用函数的apply method of functions

var ajaxservices = ["url-getdata1", "url-getdata2"],
    callbacks = [callbackdata1, callbackdata2];
// assuming a function "callAjax()" that takes an url and returns a promise

var promises = $.map(ajaxservices, callAjax); // loop and generate array

$.when.apply($, promises).done(function () {
    for (var i = 0; i < callbacks.length; i++) {
        callbacks[i].apply(null, arguments[i]);
    }
});

答案 1 :(得分:0)

*已更新 - 无法按预期工作(请参阅下面的实际解决方案)

方法失败

我找到了使用eval的方法...它没有经过全面测试,但似乎没问题。请随时发表您的意见/权衡。

callAjax是一个接收url并返回诸如return $.ajax(...)之类的promise的方法,但由于我应该使用.when语句执行它,所以我将所有调用都放在一个字符串中以便以后使用在.when语句中评估它们。

convertAjaxCallsToString = function () {
    var result = '';
    for (var i = 0; i < ajaxservices.length; i++) {
        result += "callAjax(ajaxservices[" + i + "])";
        if (i + 1 < ajaxservices.length) {
            result += ",";
        }
    }

    return result;
}

由于我不期望超过10个ajax调用,我将这些10个响应硬编码(arg 0 - 9),如下所示...如果我只使用3个ajax服务,那么只有3个arg应该具有值并且其他人将是undefined,永远不会是eval,因为callbacks.length也应该是3。

var ajaxcalls = _self.convertAjaxCallsToString();

$.when(eval(ajaxcalls)).done(function (arg0, arg1, arg2, arg3, arg4, arg5, arg6, arg7, arg8, arg9) {
    for (var i = 0; i < callbacks.length; i++) {
        //If you expect a page response, Each argument is an array with the following structure: [ data, statusText, jqXHR ]
        var data = eval('arg' + i)[0];
        callbacks[i](data);
    }

});

可行解决方案

调用ajax没有像我预期的那样工作,所以我决定使用另一种方法。经过测试并且工作正常!

$.when(ajax(0), ajax(1), ajax(2), ajax(3), ajax(4), ajax(5), ajax(6), ajax(7), ajax(8), ajax(9))
.done(function (arg0, arg1, arg2, arg3, arg4, arg5, arg6, arg7, arg8, arg9) {
        for (var i = 0; i < callbacks.length; i++) {
            //If you expect a page response, Each argument is an array with the following structure: [ data, statusText, jqXHR ]
            var data = eval('arg' + i)[0];
            callbacks[i](data);
        }

    });

如果没有要调用的ajax服务,ajax将返回0。

var ajax = function (index) {
            if (index < ajaxservices.length) {
                return callAjax(ajaxservices[index]);
            }

            return 0;
        }