jquery.when did 不起作用 : it's executed immediately

Question

这个问题不太可能对任何 future 的访客有帮助；它只与一个较小的地理区域、一个特定的时间点或一个非常狭窄的情况相关，通常不适用于全世界的互联网受众。如需帮助使此问题更广泛适用， visit the help center 。

已关闭 10 年前。

我已经在 jQuery 1.7 中编写了这个代码:

$.when($.ajax({
    type: "GET",
    url: internalOrderServiceURL,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: $.proxy(this.retrieveInternalOrderSuccess, this),
    error: $.proxy(this.retrieveInternalOrderError, this)
}), $.ajax({
    type: "GET",
    url: rejectionReasonServiceURL,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: $.proxy(this.retrieveRejectionReasonSuccess, this),
    error: $.proxy(this.retrieveRejectionReasonError, this)
})

).done(

$.ajax({
    type: "GET",
    url: salesOrderInfoServiceURL,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: $.proxy(this.retrieveServiceItemSuccess, this),
    error: $.proxy(this.retrieveServiceItemError, this)
})

);

但是，回调retrieveServiceItemSuccess是在retrieveInternalOrderSuccess和retrieveRejectionReasonSuccess之前执行的。谁能告诉我这有什么问题吗？

我已将代码更改为:

$.when($.ajax({
                            type : "GET",
                            url : internalOrderServiceURL,
                            contentType : "application/json; charset=utf-8",
                            dataType : "json",
                            success : $.proxy(this.retrieveInternalOrderSuccess, this),
                            error : $.proxy(this.retrieveInternalOrderError, this)
                        }), $.ajax({
                            type : "GET",
                            url : rejectionReasonServiceURL,
                            contentType : "application/json; charset=utf-8",
                            dataType : "json",
                            success : $.proxy(this.retrieveRejectionReasonSuccess, this),
                            error : $.proxy(this.retrieveRejectionReasonError, this)
                        })).done(function() {
                            $.ajax({
                                type : "GET",
                                url : salesOrderInfoServiceURL,
                                contentType : "application/json; charset=utf-8",
                                dataType : "json",
                                success : $.proxy(this.retrieveServiceItemSuccess, this),
                                error : $.proxy(this.retrieveServiceItemError, this)
                            })
                        });

但是这一次，第一个回调retrieveInternalOrderSuccess 执行，然后第二个回调执行(retrieveRejectionReasonSuccess) - 这两个回调的执行顺序是随机的。但是第三个回调不执行。有人能告诉我出了什么问题吗？

我尝试添加这个:

var self = this;
                        $.when($.ajax({
                            type : "GET",
                            url : internalOrderServiceURL,
                            contentType : "application/json; charset=utf-8",
                            dataType : "json",
                            success : $.proxy(this.retrieveInternalOrderSuccess, this),
                            error : $.proxy(this.retrieveInternalOrderError, this)
                        }), $.ajax({
                            type : "GET",
                            url : rejectionReasonServiceURL,
                            contentType : "application/json; charset=utf-8",
                            dataType : "json",
                            success : $.proxy(this.retrieveRejectionReasonSuccess, this),
                            error : $.proxy(this.retrieveRejectionReasonError, this)
                        })).done(function() {
                            $.ajax({
                                type : "GET",
                                url : salesOrderInfoServiceURL,
                                contentType : "application/json; charset=utf-8",
                                dataType : "json",
                                success : function(oResult) {
                                    self.retrieveServiceItemSuccess(oResult);
                                },
                                error : function(oResult) {
                                    self.retrieveServiceItemError(oResult);
                                },
                            })
                        });

这次回调以正确的顺序调用。有人能澄清一下吗？

Answer 1

函数参数总是在传递之前进行评估。您需要传递一个函数来进行第二个ajax调用。

$.when($.ajax({
    type: "GET",
    url: internalOrderServiceURL,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: $.proxy(this.retrieveInternalOrderSuccess, this),
    error: $.proxy(this.retrieveInternalOrderError, this)
}), $.ajax({
    type: "GET",
    url: rejectionReasonServiceURL,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: $.proxy(this.retrieveRejectionReasonSuccess, this),
    error: $.proxy(this.retrieveRejectionReasonError, this)
})

).done(function () {

    $.ajax({
        type: "GET",
        url: salesOrderInfoServiceURL,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: $.proxy(this.retrieveServiceItemSuccess, this),
        error: $.proxy(this.retrieveServiceItemError, this)
    })
}
);

为了使其更具可读性和明显性，请考虑将每个 .ajax() 调用分解为自己的函数:

function firstAjax() { /* ... */}
function secondAjax() { /* ... */}
function thirdAjax() { /* ... */}

$.when(firstAjax, secondAjax).done(thirdAjax);

只需确保各个函数返回 $.ajax() 返回的值即可。