jQuery Ajax SyncLock

Question

我有幾個按鈕，用戶可以點擊使用jQuery的$ .ajax加載內容。所有按鈕都將內容加載到同一個div標籤中。問題是，如果用戶快速點擊多次，內容可能會閃爍幾次，然後着陸在正確的內容上。

我對此有什麼解決方法？我正在考慮類似.net的SyncLock功能，但在JavaScript/jQuery中。理想的解決方案是取消當前隊列中的請求並啓動新的請求。

需要注意的一件事是，可能會有多個不相關的Ajax請求正在進行，因此我無法清除所有請求，只是與此一個div標記相關的請求。

Answer 1

清除/取消請求是一項昂貴的任務，所以你真的需要它不這樣做。它也不會停止服務器端的執行，只需關閉httprequest即可。

你應該做的是設置一個「鎖」，並相應地鎖定和解鎖。喜歡的東西：

var working = false; 

function startAjax() { 
    working = true; 
    // do ajax and wait for callback() 
} 

function callback() { 
    working = false; 
} 

中的按鈕。點擊（）請務必檢查是否實際執行前的工作：

$("#thebutton1, #thebutton2").click(function() { 
    if(working) { 
     alert("Im in the middle of something"); 
    } else { 
     // execute... 
    } 
}); 

Answer 2

你可以做的是要有輸出發送所有按鈕的單擊事件到相同的div禁用按鈕。然後在AJAX回調中，一旦處理完響應，就可以重新啓用它們。