jQuery.ajax（）：放棄緩慢的請求

我已經用jQuery.ajax（）方法構建了一個livesearch。在每個鍵入事件中，它都會從服務器接收新的結果數據。jQuery.ajax（）：放棄緩慢的請求

問題是，當我輸入速度非常快時，例如，「foobar」和「fooba」的GET請求需要比「foobar」請求更多的時間，「fooba」的結果被顯示。

爲了處理這個超時參數是不可能的，我想。

有沒有人有一個想法如何解決這個問題？

2010-06-15 Thomas

爲每個請求分配一個唯一的遞增ID，並且僅以遞增順序顯示它們。例如：

var counter = 0, lastCounter = 0; 
function doAjax() { 
    ++counter; 
    jQuery.ajax(url, function (result) { 
    if (counter < lastCounter) 
     return; 
    lastCounter = counter; 
    processResult(result); 
    }); 
}

來源

2010-06-15 17:56:24 Wim

您應該只在用戶沒有輸入任何內容（500ms左右）時纔開始搜索。這可以防止你遇到的問題。

一個優秀的jQuery插件，它就是這樣做的是delayedObserver：

http://code.google.com/p/jquery-utils/wiki/DelayedObserver

來源

2010-06-15 17:58:06

好評。儘管如果響應時間的差異可能大於.5s（高負載共享主機很容易），它並不能保證解決他的問題。 – Wim 2010-06-15 17:59:45

使它所以每次取消了最後。這可能是太多的取消，但是當輸入慢時，它會觸發。

來源

2010-06-15 17:59:58 Eli

這似乎是大量的流量發送每個KeyUp事件的ajax請求。你應該等待用戶停止輸入 - 大概他們已經完成了，至少幾百毫秒。

我會做的是這樣的：

var ajaxTimeout; 

function doAjax() { 
    //Your actual ajax request code 
} 


function keyUpHandler() { 
    if (ajaxTimeout !== undefined) 
     clearTimeout(ajaxTimeout); 

    ajaxTimeout = setTimeout(doAjax, 200); 
}

您可能必須與實際的超時時間玩，但這種方式工作得很好，不需要任何其他插件。

編輯：如果您需要傳入參數，請創建一個內聯函數（閉包）。

... 
var fun = function() { doAjax(params...) }; 
ajaxTimeout = setTimeout(fun, 200);

來源

2010-06-15 18:00:11 partkyle

你會希望某種形式的AJAX隊列，如：

http://plugins.jquery.com/project/ajaxqueue

或http://www.protofunc.com/scripts/jquery/ajaxManager/

編輯：另一種選擇，研究自動完成插件代碼和模仿這一點。（有幾個自動完成以及在jQuery的UI 或只是實現自動完成，如果這符合您的需求

來源

2010-06-15 18:00:49

您可以存儲和.abort()開始當一個新的，像這樣的最後一個請求：

var curSearch; 
$("#myInput").keyup(function() { 
    if(curSearch) curSearch.abort(); //cancel previous search 
    curSearch = $.ajax({ ...ajax options... }); //start a new one, save a reference 
});

的$.ajax()方法返回XmlHttpRequest對象，所以才掛到它，當你開始進行下一次搜索，中止前一個。

來源

2010-06-15 23:38:31

jQuery.ajax（）：放棄緩慢的請求

回答

相關問題