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

Posted 2023-02-25

【中文标题】jquery.when done 不起作用：它立即执行[关闭]

【英文标题】：jquery.when done doesn't work: it's executed immediately [closed]

【发布时间】：2013-04-02 20:27:43

【问题描述】：

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

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

【问题讨论】：

这个问题实际上回答了我遇到的一个问题，所以虽然不太可能帮助别人，但确实如此。

【参考方案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 仍然断章取义。

【讨论】：

恐怕不行。我已经编码了这个：

我无法修复doesn't work。

你是绝对正确的凯文，让我解释你有什么问题。我似乎无法在这部分粘贴任何代码，让我弄清楚该怎么做......

@marco_sap 在这一点上，我认为我不需要更多代码，我需要知道“为什么”它没有完成。很可能正在触发fail 回调，其中将提供有关它为什么不工作的信息。

我刚刚复制了我在上面的问题中编写的整个代码。前两个回调成功执行。 done 分支中的回调未执行。我在回调函数 retrieveInternalOrderSuccess、retrieveRejectionReasonSuccess、retrieveServiceItemSuccess、retrieveServiceItemError 中在 chrome 中设置了一个断点，并且我 100% 确定没有执行 retrieveServiceItemSuccess 和 retrieveServiceItemError。

【参考方案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() 返回的值。

【讨论】：

我已经进行了您的更改。但是这一次调用了 firstAjax，调用了 secondAjax 而没有调用 thirdAjax（完成部分中的函数）。可以请教吗？

将您的更改添加到问题中，以便我看到它们。

看起来不错，只是 thirdAjax 中的 this 与以前不同。