AJAX: Form alanında yazarak arama için gecikme

Question

Web sitemde, kullanıcı hala yazarken arama yapmak ve sonuçları göstermek için JavaScript/AJAX kullanıyorum.

HTML (gövde):

<form action="" method="post" accept-charset="utf-8"> 
    <p><input type="text" name="q" id="q" value="" onkeyup="doSearch(this.value)" /></p> 
</form> 

JavaScript (başlık):

function doSearch(text) { 
    // do the ajax stuff here 
    // call getResults.php?search=[text] 
} 

Ama bu sunucuya gelen istekleri bir sürü neden olabilir.

Böylece bir gecikme kurarak sunucuyu rahatlatmak istiyorum: onkeyup olay tetiklenir zaman

, işlev doSearch() Bir "ajax yükleme grafiği" göstermek ve 2 saniye beklemeniz gerekir. Sadece bu 2 saniye boyunca olay tekrar DEĞİLSE, sonuçlar PHP dosyasından alınmalıdır.

Bunu yapmanın bir yolu var mı? Bana yardım edebilir misiniz, lütfen? Şimdiden teşekkürler!

Answer 1

var delayTimer; 
function doSearch(text) { 
    clearTimeout(delayTimer); 
    delayTimer = setTimeout(function() { 
     // Do the ajax stuff 
    }, 1000); // Will do the ajax stuff after 1000 ms, or 1 s 
} 

Answer 2

setTimeout() ile gecikmeli çağırma, sonra clearTimeout()

HTML ile her olaya tekrar kaldırmak

Basitçe kurulum

<form action="" method="post" accept-charset="utf-8"> 
    <p><input type="text" name="q" id="q" value="" onkeyup="doDelayedSearch(this.value)" /></p> 
</form> 

JavaScript

var timeout = null; 

function doDelayedSearch(val) { 
    if (timeout) { 
    clearTimeout(timeout); 
    } 
    timeout = setTimeout(function() { 
    doSearch(val); //this is your existing function 
    }, 2000); 
} 

Answer 3

http://remysharp.com/2010/07/21/throttling-function-calls/