ajax使用多個調用覆蓋XHR對象-jQuery

Question

我有一個函數someFunction（）通過jQuery發送ajax requet。

如果用戶單擊滿意，該請求似乎會被覆蓋...而我無法弄清楚原因。

var request = $.ajax(customObject);
request.done(doneFunction);
request.fail(failFunction);

每次用戶觸發函數時，傳遞給doneFunction（）和failFunction（）的XHR對象都會被覆蓋。

這是一個問題，因為完成動畫后， doneFunction（）和failFunction（）將延遲的動畫與回調一起使用來更改html（從XHR對象派生）。

有什么想法/建議嗎？

• 注意我正在使用局部變量而不是全局變量...已經想到了...

Answer 1

您可以添加一個變量來檢查是否已發送請求，並在完成之前阻止發送另一個請求。 像這樣：

var requestSent = false;

function someFunction() {
    if (!requestSent) {
        requestSent = true;

        $.ajax({
            url: [url],
            type: [type],
            data: [data],
            success: function (xhr) {
                doneFunction(xhr);
                requestSent = false;
            },
            failure: function (xhr) {
                failFunction(xhr);
                requestSent = false;
            }
        });
    }
}

Answer 2

一種簡單的方法是隱藏或禁用按鈕，直到ajax調用返回。 在someFunction() ，可以禁用按鈕，並顯示“正在加載”微調器圖像，然后在success和failure回調中，啟用按鈕，然后刪除“正在加載”微調器。

如果要允許多個請求，則需要實現一個隊列，並依次進行AJAX調用。 基本上，創建一個對象來保存您的AJAX函數隊列。 當一個請求返回時，請呼叫下一個。 這里有一些例子：

• 使用jQuery的隊列功能的小要點
• 來自Alex MacCaw的jQuery插件