2013-03-07 76 views
1

我有一個很大的表單,其中更改任何值應該觸發對服務器的ajax調用,執行一些計算並返回結果。但問題是,用戶不會等待每個ajax調用完成,並且在幾次這樣的調用堆積之後,我得到的最後結果可能不是最近一次調用服務器的結果,因爲每個調用的響應時間ajax呼叫可能並將根據數據和其他因素而有所不同。但是我需要確保向用戶展示與最近更改相對應的數據。所以,我需要確保使用jquery get或post的最新響應

1)有沒有辦法避免這種情況,而使用$ .get()或$ .post()?

2)在上述兩種方法中有沒有辦法使用同步/異步?或者我必須使用$ .ajax()?

編輯:

我用一個簡單的Ajax方法

$("#someField").blur(function(e){ 

    $.get("someURL.php?v="+$(this).val(),function(d){ 

     $("#result").html(d); 
    }); 

}) 
+0

你能提供你已經使用的代碼片段嗎?使用.get或.post回調函數可以讓您在收到返回結果時調用其他函數。 – John 2013-03-07 11:28:47

+0

我修改了我的帖子,看到上面的 – Bluemagica 2013-03-07 11:32:09

+0

我認爲你需要使用遞歸回調 - 讓它自己調用,但只要它完成了,不管它在後端做什麼 – 2013-03-07 11:32:48

回答

5

如果您在完成先前調用的相同請求之前再次調用相同的請求,那麼您希望中止prevoius請求並繼續處理新的請求。

var xhr = null; 
$("#someField").blur(function(e){ 
    if(xhr)xhr.abort(); 
     xhr=$.get("someURL.php?v="+$(this).val(),function(d){ 
       $("#result").html(d); 
      }).done(function() { xhr = null; }); 
}) 
0

如果Ajax調用不進行數據的任何更改(只計算和閱讀)。如果您在再次調用ajax之前中止任何以前的調用,那就沒問題了。

+0

我如何檢查並中止以前未完成的請求? – Bluemagica 2013-03-07 11:36:15

1

2)你可以利用這一點,來設定AJAX調用同步或異步:

$.ajaxSetup({async: false}); 

調用該函數後,下面的AJAX調用($阿賈克斯,.post的$,$不用彷徨)運行syncronous 。 我認爲你可以在post中使用async參數,並像ajax方法那樣獲取方法。 (但不知道)

但我不推薦它。 Javascript應該用作異步語言。 你應該停止以前的電話。另一位評論者寫道。

+0

確實沒有。永遠永遠不會使用{async:false}。 – 2013-03-07 11:51:35

+0

@Kovge非常感謝您的幫助,但您是否也可以解釋爲什麼我不應該使用同步模式?除了明顯的可用性滯後之外,是否還有其他潛在問題? – Bluemagica 2013-03-07 12:28:22

+0

@aoi。如果您對async vs sync ajax調用感興趣,本文可能會爲您介入:http://javascript.about.com/od/ajax/a/ajaxasyn.htm – Kovge 2013-03-07 19:10:24

0

jQuery自動完成插件(http://www.devbridge.com/projects/autocomplete/jquery/)使用的一種方法是將查詢包含在響應中,以確保顯示的結果適用於正確的查詢。

就你而言,你可以考慮在每個Ajax請求中包含一個遞增的請求代碼,並在jQuery中跟蹤它。收到回覆後,您可以將其與當前請求代碼進行比較,以確定結果是針對最新查詢還是針對之前的查詢。儘管收到的最新響應低於最新發送的查詢,但您可以提供一些視覺提示,指出某些操作正在處理中,或者包含所有結果。當然,我們需要一些額外的信息來確保在你的情況下這是可能的。

不知道我是否理解你的第二個問題 - 上面的Kovge可能已經回答了。

0

幸運的是,jqXHR對象支持底層XMLHttpRequest對象的abort()方法,允許懸而未決/ unrejected AJAX請求被中止。

這可以通過保持對前面的$.get()返回的jqXHR對象的引用來完成。

var blurPromise; 

$("#someField").blur(function(e) { 
    if(blurPromise) blurPromise.abort(); 
    blurPromise = $.get("someURL.php?v="+$(this).val(), function(d) { 
     $("#result").html(d); 
    }); 
}); 

當blurPromise未定義時,if(blurPromise)測試用於處理初始條件。

有沒有必要清空blurPromise。在已解析的jqXHR上調用abort()將被忽略。