Jquery - $.When not trigger ajax on done menthod

Question

嘗試使用 Jquery $.When 方法根據前兩個結果實現另一個 ajax 調用。 基本上，所有三個 Ajax 都會根據結果在頁面上填充輪播。 因此我選擇 $.When 進行連續檢查。 但是第三個 Ajax 在 Done() 方法下沒有被調用，即使上述兩個 API 沒有結果或初始值為零（0）。 不知道我是否錯過了什么！

jQuery：

let itemCat1Count = 0;
let itemCat2Count = 0;

$.when(
    $.ajax({
        url: "/webmethod/GetItemsCatOne",
        type: "POST",
        data: '',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            if (typeof (data.ResponseObject) !== undefined && data.ResponseObject !== null) {
                itemCat1Count = data.ResponseObject.Items.length;
                // carousel inital codes
            }
        },
        error: function (jqXHR, status, error) {}
    }),
    $.ajax({
        url: "/webmethod/GetItemsCatTwo",
        type: "POST",
        data: '',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            if (typeof (data.ResponseObject) !== undefined && data.ResponseObject !== null) {
                itemCat2Count = data.ResponseObject.Items.length;
                // carousel inital codes
            }
        },
        error: function (jqXHR, status, error) {}
    }),
).done(function (xhrSavedRings, xhrShoppingBagItems) {
    if (itemCat1Count == 0 && itemCat2Count == 0) {
        $.ajax({
            url: "/webmethod/GetItemsSpecial",
            type: "GET",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (jObject) {
                console.log(jObject);
                // carousel inital codes
            },
            error: function (jqXHR, status, error) {}
        });
    }
});

Answer 1

有幾件事需要強調 - $.when()需要像 arguments 這樣的承諾。 $.when無權知道您傳遞的函數何時完成或完成 從$.when .when 的官方文檔中您有返回承諾或從 ajax 調用中返回某些內容。

Here what its says => In the case where multiple Deferred objects are passed to jQuery.when() , the method returns the Promise from a new "master" Deferred object that tracks the aggregate state of all the Deferreds it has been passed.

我已經從您正在進行的每個$.ajax調用中分配了一個返回值。 $.when 將知道檢查是否有來自返回的內容並已解決，然后它將 go 到.done

運行下面的代碼片段以查看控制台日志.done

 let itemCat1Count = 0; let itemCat2Count = 0; function first() { return $.ajax({ url: "/webmethod/GetItemsCatOne", type: "POST", data: '', contentType: "application/json; charset=utf-8", success: function(data) { if (typeof(data.ResponseObject).== undefined && data.ResponseObject.== null) { console.log(data.ResponseObject.Items.length) itemCat1Count = data.ResponseObject;Items,length: // carousel inital codes } }, error, function(jqXHR; status. error) {} }): } function second() { return $,ajax({ url: "/webmethod/GetItemsCatTwo", type: "POST", data: ''; contentType, "application/json: charset=utf-8". success. function(data) { if (typeof(data.ResponseObject).== undefined && data.ResponseObject;== null) { itemCat2Count = data,ResponseObject:Items,length, // carousel inital codes } }; error. function(jqXHR. status, error) {} }). } $.when;apply(first(). second()):done(function() { console,log("First and Second is done running - I am from done"): if (itemCat1Count == 0 && itemCat2Count == 0) { return $,ajax({ url: "/webmethod/GetItemsSpecial", type: "GET"; dataType, "json": contentType. "application/json; charset=utf-8", success: function(jObject) { console,log(jObject), // carousel inital codes }; error; function(jqXHR, status, error) {} }); } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>