jQuery AJAXリクエストに遅延を追加しようとしています

Question

AJAXリクエストを遅延させて、入力セルのLASTキーアップから2〜3秒後に送出しようとしています。
これまでのところ私はリクエストを遅らせていましたが、2-3秒後にはフィールド内のすべてのキーアップに対して1つのリクエストが送られてきました...
jQueryは最初のものをキャンセルして最後のキーアップを送信できますか？
はここで、これまでのコードです：上記

$('#lastname').focus(function(){ 
      $('.terms :input').val(""); //clears other search fields 
}).keyup(function(){ 
    caps(this); //another function that capitalizes the field 
    $type = $(this).attr("id"); // just passing the type of desired search to the php file 
     setTimeout(function(){ // setting the delay for each keypress 
       ajaxSearchRequest($type); //runs the ajax request 

     }, 1000); 
}); 

このコードは、その後、1秒を待つキー押下に応じて、4-5 AJAX要求を送信します。 私はちょうど最後の後に送信されます。keyup
私はJavascriptを使用するStackOverflowでいくつかの同様のソリューションを見つけましたが、私はプログラミングの小さな知識のために私のプロジェクトにそれらを実装することができませんでした。あなたができるようになるので、

function ajaxSearchRequest($type){ 
       var ajaxRequest2; // The variable that makes Ajax possible! 

       try{ 
        // Opera 8.0+, Firefox, Safari 
        ajaxRequest2 = new XMLHttpRequest(); 
       }catch (e){ 
        // Internet Explorer Browsers 
        try{ 
        ajaxRequest2 = new ActiveXObject("Msxml2.XMLHTTP"); 
        }catch (e) { 
        try{ 
        ajaxRequest2 = new ActiveXObject("Microsoft.XMLHTTP"); 
        }catch (e){ 
        // Something went wrong 
        alert("Browser error!"); 
        return false; 
        } 
        } 
       } 

       ajaxRequest2.onreadystatechange = function(){ 
        if(ajaxRequest2.readyState == 4){ 

         $result = ajaxRequest2.responseText; 
         $('#resultcontainer').html($result); 

        }} 


       var searchterm = document.getElementById($type).value; 


       var queryString ="?searchterm=" + searchterm +"&type=" +$type; 


       if(searchterm !== ""){ 

       ajaxRequest2.open("GET", "searchrequest.php" + 
           queryString, true); 
       ajaxRequest2.send(null); 
       } 
     } 

Answer 1

店変数でタイムアウト：

[SOLVED] 最終作業コード、@ Dr.Molleのおかげ：ここ

$('#lastname').focus(function(){ 
      $('.terms :input').val(""); 
}).keyup(function(){ 
    caps(this); 
    $type = $(this).attr("id"); 

    window.timer=setTimeout(function(){ // setting the delay for each keypress 
      ajaxSearchRequest($type); //runs the ajax request 

     }, 3000); 

}).keydown(function(){clearTimeout(window.timer);}); 

はajaxSearchRequestコードです最近のタイムアウトをクリアするには：

clearTimeout(window.timer); 
window.timer=setTimeout(function(){ // setting the delay for each keypress 
       ajaxSearchRequest($type); //runs the ajax request 

     }, 3000); 

Answer 2

私はMolle's swerしかし、私はさらにパフォーマンスを向上させるつもりです

var ajaxRequest2; // The variable that makes Ajax possible! 
function getAjaxObject() 
{ 
       try{ 
        // Opera 8.0+, Firefox, Safari 
        ajaxRequest2 = new XMLHttpRequest(); 
       }catch (e){ 
        // Internet Explorer Browsers 
        try{ 
        ajaxRequest2 = new ActiveXObject("Msxml2.XMLHTTP"); 
        }catch (e) { 
        try{ 
        ajaxRequest2 = new ActiveXObject("Microsoft.XMLHTTP"); 
        }catch (e){ 
        // Something went wrong 
        alert("Browser error!"); 
        // return false; 
        } 
        } 
       } 
    return ajaxRequest2; 


} 
    getAjaxObject(); 

    function ajaxSearchRequest($type){ 



       if(typeof ajaxRequest2 =="undefined" || ajaxRequest2 == false) 
       { 
        return; 
       } 
       ajaxRequest2.abort(); 

       ajaxRequest2.onreadystatechange = function(){ 
        if(ajaxRequest2.readyState == 4){ 

         $result = ajaxRequest2.responseText; 
         $('#resultcontainer').html($result); 

        }} 


       var searchterm = document.getElementById($type).value; 


       var queryString ="?searchterm=" + searchterm +"&type=" +$type; 


       if(searchterm !== ""){ 

       ajaxRequest2.open("GET", "searchrequest.php" + 
           queryString, true); 
       ajaxRequest2.send(null); 
       } 
     } 

この変更は、進行中のajax要求を中止し、新しい要求を送信します。あなたは

Typed->が待っていたとき、それは便利です4秒 - >リクエスト送信し - >（応答がない受信）を再度入力された - >待っていた4 2番目に>別の要求は、火災と呼ばれて何をしようとしている

Answer 3

をデバウンスします。

ここでは仕事をするベン・アルマンのjquery pluginです。

また、underscore.jsにもこの機能が含まれています。

実際にはajaxリクエストシステムをハックする必要はありませんそれが正しい瞬間に呼び出されたことを確認してください。