3

だから私はjqueryでオートコンプリートを作っています。Ajaxは、リモートの場所から重いxmlファイルを取得するために使用されます。私が例を検索した場合。「2人半の男性」は、ajaxを使用して約16のクエリを実行します(最初の3つを除いて、入力されたすべての文字について、コードを確認してください)。

ユーザーが最後のキーを押してから1秒後にAjaxリクエストを実行して、16ではなく1つのクエリを実行するようにします。

したがって、最後のキーダウンイベントから1秒が経過する前にユーザーが別のキーを押した場合、ユーザーはまだクエリを実行しません。

<script>
    $(document).ready(function(){
        $('#tv_search').keydown(function(){
            var search = $(this).val();
            if(search.length >= 3)
            {
                $.ajax({
                  type: "GET",
                  url: "search.php",
                  data: {show : search, key : '890k4900k0ll' }
                }).done(function(msg){
                    $('#t').html(msg);
                });
            }
        });
    });
</script>

Search for series: <input type='text' name='tv_search' id='tv_search'>

何か案は?

4

4 に答える 4

7

タイムアウトを使用して、キーが押されるたびにタイムアウトをクリアすることができます:

$(document).ready(function() {
    $('#tv_search').on('keyup', function() {
        clearTimeout($(this).data('timer'));
        var search = this.value;
        if (search.length >= 3) {
            $(this).data('timer', setTimeout(function() {
                $.ajax({
                    type: "GET",
                    url: "search.php",
                    data: {
                        show: search,
                        key: '890k4900k0ll'
                    }
                }).done(function(msg) {
                    $('#t').html(msg);
                });
            }, 1000));
        }
    });
});​
于 2012-12-14T04:25:38.457 に答える
3

キーを押すたびに複数のAJAXリクエストが生成されないようにするには、最後のタイムアウトをキャンセルし、クリアした後に呼び出すことで新しいタイムアウトを開始する方法でメソッドを使用setTimeout()してみてください。メソッドには、ユーザーが1/4秒(250ミリ秒)キーを押した後に実行されるAJAXリクエストが含まれている必要があります。clearTimeout()setTimeout()setTimeout()

可能であればリクエストもabort()お願いします。

var timeOut = null,
    myXHR = null;
$(document).ready(function(){
    $('#tv_search').keydown(function(){
        // It will clear the setTimeOut activity if valid.
        if(timeOut) clearTimeout(timeOut);

        var search = $(this).val();
        if(search.length >= 3)
        {
            timeOut = setTimeout(function(){
              // Cancel the last request if valid
              if(myXHR) myXHR.abort();

              myXHR = $.ajax({
                type: "GET",
                url: "search.php",
                data: {show : search, key : '890k4900k0ll' }
              }).done(function(msg){
                  $('#t').html(msg);
              });
            }, 250);// wait for quarter second.
        }
    });
});
于 2012-12-14T04:25:42.283 に答える
0

まったく使用されない、繰り返しの呼び出しを避けて、呼び出すメソッドを遅らせることができるソリューションがあります。

https://stackoverflow.com/a/30503848/1834212

于 2015-05-29T12:40:49.907 に答える
0

簡単な解決策をやめる:

<script>
$(document).ready(function(){
var mytimer;
    $('#tv_search').keydown(function(){
       clearTimeout(mytimer);
        var search = $(this).val();
        if(search.length >= 3)
        {
           mytimer = setTimeout(function(){
             $.ajax({
              type: "GET",
              url: "search.php",
              data: {show : search, key : '890k4900k0ll' }
            }).done(function(msg){
                $('#t').html(msg);
            });
         }, 1000);
        }
    });
});

' mytimer 'はグローバル変数でなければなりませんが、すべてのイベント呼び出しで前の' mytimer 'をクリアするだけです。1秒間隔で最新の呼び出しのみを実行します。

于 2016-11-24T12:26:48.783 に答える