如何防止在jQuery的同一時間多個職位相同的頁面？

我有一個輸入的搜索是這樣的：如何防止在jQuery的同一時間多個職位相同的頁面？

<input type="search" autocomplete="off" name="searchSchools" id="searchSchools" value="" onKeyUp="searchSchools(this.value)" />

你可以SE，每次onkeyup事件被觸發我調用一個函數名爲「searchSchools」其中i搜索學校匹配輸入搜索的當前值PHP和我的JSON格式返回他們的問題是，如果我型快速不止一個請求被髮送到PHP頁面，我想避免這種情況，我想發送POST請求的頁面只有在沒有其他請求到此功能所做的同一頁面。

下面是函數：

function searchSchools(name){ 
    $.post("search-schools.php", { name: name }, 
    function(data) { 
     //-> Here i do whatever with data returned 
    }, 
    "json" 
    ); 
}

來源

2012-05-21 gustavomanolo

可能是一個壞主意，因爲那麼你就永遠只能查詢的第一個字符，當用戶輸入一個完整的單詞已經 - 有效地導致很大的延遲 – skarmats

添加延遲$.post ..嘗試像下面，

var timer = null, xhrReq = null; 
function searchSchools(name){ 
    if (timer != null) { 
     clearTimeout(timer); 
    } 

    timer = setTimeout(function() { 
     if(xhrReq != null) { 
      xhrReq.abort(); //to kill all prev request and take the latest 
     } 

     xhrReq = $.post("search-schools.php", { name: name }, 
      function(data) { 
       //-> Here i do whatever with data returned 
      }, 
      "json" 
     ); 
    }, 1000); //will be posted only after 1 second. 
}

編輯：新增xhr.abort()中止任何舊的請求，並只考慮最新..

來源

2012-05-21 18:30:15

延遲是不可靠的，以告訴如果ajax請求已完成 – Rab

@RabNawazKhan延遲的目的不是要告訴請求是否完成，它是不發送請求，除非用戶停止輸入輸入。類似於jQuery Autocomplete的做法。 –

結果可能以錯誤的順序返回。相對不太可能，雖然 – skarmats

var request; 
function searchSchools(name){ 
    if (!request) { 
     request = $.post("search-schools.php", { name: name }, 
     function(data) { 
      request = false; 
      //-> Here i do whatever with data returned 
     }, 
     "json" 
     ); 
    } 
}

來源

2012-05-21 18:31:51 fcalderan

信號燈比延遲好多了。 +1 –

是的，延遲是不可靠的告訴如果ajax請求已經完成:) – fcalderan

這不是隻對第一個字母的請求，而是在用戶完成鍵入後才請求？ –

假設你不希望我在我的第一個評論指出，在OP行爲

我想辦法的這種問題更浪費的方式：

var xhr; 
function search(term) { 
    if (xhr) { 
     xhr.abort(); 
    } 

    xhr = $.post(...); 
}

這使得基本邏輯多更容易處理，因爲中止請求的成功回調不會被調用，並且您始終可以獲得有關實際輸入的最新結果。

如果你是警惕啓動和中止潛在的許多要求，介紹了在適當的鍵事件的節流 - 因而也實現所關心的問題政企分開。

給xhr腳本中正確的上下文 - 在本例中它是全局的。你想避免這種情況。

EDIT1 - 補充說：

xhr是從來沒有設置。你可能想在complete處理jQuery的AJAX設置對象的做到這一點英寸在另一方面，在中止或完成的請求調用abort()是 - 實際上 - 一個NOP

來源

2012-05-21 18:43:16 skarmats

如何防止在jQuery的同一時間多個職位相同的頁面？

回答

相關問題