jquery.when done 不起作用：它立即执行[关闭]

Question

我已经在 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

.done 需要一个函数来执行，而不是一个 promise 对象。

.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)
    })

});

this 仍然断章取义。

Answer 2

函数参数总是在传递之前进行评估。您需要传递一个 function 来进行第二次 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() 返回的值。