jQueryイベントのコールバックを抑制する方法は？

Question

私はGoogleのように検索するので、入力したテキストを入力するとすぐに入力できます。しかし、私はそれが好きではありません。私はそのようなものを使用します$("TEXTINPUT").keyup(function() {。ユーザーが非常に高速に入力すると、データベースに何度も接続します。それは、ユーザーが1-2秒間入力を停止したときにのみPHPファイルに接続することは可能ですが、即座にはできませんか？私はjQueryでそれを行う必要があります。ありがとう。ここで

Answer 1

試してみてください。

var time_out; 
$("TEXTINPUT").keyup(function(){ 
    clearTimeout(time_out); 
    time_out = setTimeout(your_function, 500); 
} 

function your_function() 
{ 
    /*CHECK DATABASE*/ 
} 

Answer 2

が、私は通常、それに近づく方法は次のとおりです。

$(function(){ 
    var tiTO, jqXHR; 
    $('textinput').keyup(function(){ 
    if (tiTO) clearTimeout(tiTO); 
    if (jqXHR && jqXHR.abort) jqXHR.abort(); 
    tiTO = setTimeout(function(){ 
     jqXHR = $.ajax({....}); 
     //Ajax call to PHP 
    },2000); 
    }); 
}); 

それぞれからkeyupは、タイムアウトをリセットし、アクティブなAJAXを中止します。

Answer 3

あなたがUnderscore Libraryを使用している場合、それはこのような単純なのです：下線サイトから

$("TEXTINPUT").keyup(_.throttle(function() {...}, 150));

ドキュメント：

スロットル     _.throttle

を繰り返し を起動したときに、唯一実際に高々一回待つミリ秒ごとに をラップ関数を呼び出します、という、機能の絞られたバージョンを返します（機能、待ちます）。 があなたに追いつくよりも速く発生するレート制限イベントに役立ちます。

デバウンス     _.debounce（機能、待つ）

後 ミリ秒が持って待つまでその実行を延期するデバウンス関数を呼び出す：

もdebounce機能があります最後の機能が であることから経過した時間。入力が到着しなくなった後に発生するような動作を実装する場合に便利です。 例えば：、値下げコメントのプレビュー をレンダリングするウィンドウが がリサイズされ停止した後に...

Answer 4

この機能は多少underscore.jsのように、余分な依存せずに行動するレイアウトを再計算します。また、呼び出されたスコープと引数をラップされた関数に渡します。 YoannMの答えとは異なり、これは外部変数を使用しない自己完結型のコールバックを返します（EG、必要な回数だけ使用します）。

function throttle (func, wait) { 
    return function() { 
     var that = this, 
      args = [].slice(arguments); 

     clearTimeout(func._throttleTimeout); 

     func._throttleTimeout = setTimeout(function() { 
      func.apply(that, args); 
     }, wait); 
    }; 
} 

使い方はunderscore.jsライブラリとほぼ同じです。

$('input').on('input keyup', throttle(function() { 
    // ... 
}, 100));