停止Ajax請求並調用新的Ajax

Question

在這段代碼中，我從用戶那里鍵入字符並在數據庫中進行搜索，但是當用戶輸入每個字符時，使用先前的ajax運行新的ajax請求，

我想在調用搜索功能時，取消先前的ajax請求並運行新的ajax請求；

html代碼：

<input type="text" onkeyup="search()">

js代碼：

    function search () {


    var request=$.ajax({
        type: "POST",
        url: "php/h.php",
        data: {k_word:k_word},
        dataType: "json",
        success: function (data) {    

          ghtml(data)       

      }
  })


 }

我也嘗試了abrot（）這樣的：

var request;

 function search () {

    request.abort();


     request=$.ajax({
        type: "POST",
        url: "php/h.php",
        data: {k_word:k_word},
        dataType: "json",
        success: function (data) {    

          ghtml(data)       

      }
  })


 }

但不起作用

Answer 1

通常這不是完成操作的方式，而是僅在用戶在給定時間內停止鍵入時才使用節流功能來調用ajax函數

首先，擺脫內聯javascript

 <input type="text" id="myInput" />

然后使用事件處理程序

$('#myInput').on('keyup', function() {

    clearTimeout( $(this).data('timer') );

    $(this).data('timer', 
        setTimeout(function() {
            $.ajax({
                type     : "POST",
                url      : "php/h.php",
                data     : {k_word:k_word},
                dataType : "json",
                success  : function (data) {    

                    ghtml(data)       

                }
            });
        }, 500)
    );
});

這將設置ajax調用的超時，並且如果在半秒鍾內按下新鍵，則超時將被清除，因此僅當用戶停止鍵入超過500毫秒時才進行ajax調用