使用setTimeout定期進行自動完成AJAX調用？

Question

我想使用setTimeout函數，以便Ajax調用最多隻能在1秒內完成。

這是我的。這顯然是不正確的，但我不知道setTimeout函數是如何工作的。

function autoComplete(q, succ) 
{ 

    setTimeout(

    if(q != "") { 
     $.ajax({type:"GET", 
      url: "php/search.php", 
      data: "q="+q, 
      success: succ 
     }); 
    } 

    , 1000); 
} 

我認爲我應該使用clearTimeout因此，如果另一個呼叫時，它會復位定時器並等待另一個1秒，但是當我試圖實現這一點，停止運行的功能。

Answer 1

傳遞一個... :)功能

使用匿名函數可能如下：

var timeoutId 
function autoComplete(q, succ) 
{ 
    if (q) { 
     // stop previous timeouts 
     clearTimeout(timeoutId) 
     timeoutId = setTimeout(function() { 
      $.ajax({type:"GET", 
       url: "php/search.php", 
       data: "q="+q, 
       success: succ 
      }); 
     }, 1000); 
    } 
} 

注意我移動支票q之外。這不會一次運行兩次超時，但可能有多個正在進行的請求。爲了防止這種情況，success回調需要一個警衛 - 一個簡單的方法是使用計數器。使用setTimeout中的q檢查「當前的q」可能會導致細微的競爭條件。

var timeoutId 
var counter = 0 
function autoComplete(q, succ) 
{ 
    if (q) { 
     // Increment counter to maintain separate versions 
     counter++ 
     var thisCounter = counter 
     clearTimeout(timeoutId) 
     timeoutId = setTimeout(function() { 
      $.ajax({type:"GET", 
       url: "php/search.php", 
       data: "q="+q, 
       success: function() { 
        // Only call success if this is the "latest" 
        if (counter == thisCounter) { 
         succ.apply(this, arguments) 
        } 
       }, 
      }); 
     }, 1000); 
    } 
} 

智能版本可能會在提交因爲上面的代碼將永遠落後1秒後面的時間閱讀當前值...

現在，想象一下getQ是一個函數對象.. 。

var timeoutId 
var counter = 0 
function autoComplete(getQ, succ) 
{ 
    counter++ 
    var thisCounter = counter 
    clearTimeout(timeoutId) 
    timeoutId = setTimeout(function() { 
     var q = getQ() // get the q ... NOW 
     if (q) { 
      $.ajax({type:"GET", 
       url: "php/search.php", 
       data: "q="+q, 
       success: function() { 
        if (counter == thisCounter) { 
         succ.apply(this, arguments) 
        } 
       }, 
      }); 
     } 
    }, 1000); 
} 

// example usage 
autoComplete(function() { return $(elm).val() }, successCallback) 

快樂編碼。

---

有一點要考慮，在上面沒有解決，就是有仍可能在飛行中多次請求（在第二個例子中後衛只顯示瞭如何「拋棄」老迴應，不如何適當限制請求）。這可以通過短隊列來處理，並且可以防止提交新的AJAX請求，直到獲得答覆或足夠的「超時」已過期並且請求被認爲無效。