javascript - 中止之前的ajax请求但有延迟吗？

Question

用户在搜索框中键入/附加下一个字母后，需要中止 Ajax 请求运行的所有先前搜索查询。

我使用以下代码来执行所需的结果。声明一个对象jqxhr来中止ajax请求:

var jqxhr = {abort: function () {}}

然后，当用户输入新内容时调用 ajax，启动此对象，如下所示:

jqxhr = $.ajax({
        type: "GET",
        url: "ContentAjax.php",
        cache: false,
        dataType: 'json',
   .........OHER CODE HERE.........

现在的问题是，如果用户输入新字母并更改最新的搜索查询，ajax 请求将被中止。但是 php 仍在执行，所以唤醒 mysql 来工作没有任何用处，严重减慢了网站速度，我知道我们不能在这里用 javascript 杀死 php 操作。

所以我尝试像这样延迟ajax请求:

jqxhr = setTimeout(function(){ $.ajax({...code..}) }, 3000);

或

setTimeout(function(){ jqxhr = $.ajax({...code..}) }, 3000);

但是这些都不起作用。它显示一个错误，指出 jqxhr.abort() 未定义。或者php Action 仍然没有停止。

请帮我解决这个问题，谢谢。

Answer 1

如果你想设置ajax超时

let timeout;

$('#yourId').on('click',function(){
   if(typeof timeout != 'undefined'){ 
       clearTimeout(timeout);
   }
  timeout = setTimeout(function() {
    //your code here
  },
  200); //milliseconds
});