Jquery 如果上一个正在运行，如何取消$.ajax请求？

我有一段简单的代码：

$(document).on("input", "#addFoodSearch", function(event){
   var search = $(this).val();
   $.ajax({ url: "/ajax/search-food.php", type: 'GET', data: { 'search' : search }, dataType: 'json' }).done(
      function(data){
         if (data[0] == 'success'){
            $('#add-food-area').html(data[1]);
            $('#add-food-area').fadeIn();
         }
      }
   );
});

我想做的是取消以前的$.ajax请求（如果有），以防用户键入太快。我只需要最新的请求就可以通过，而不需要它们的整个序列

---

如何实现这一点？

您需要存储对正在进行的AJAX请求的引用，然后对其调用

abort（）

方法

var ajax;

$(document).on("input", "#addFoodSearch", function(event){
   var search = $(this).val();

   if (ajax) {
       ajax.abort();
   }

   ajax = $.ajax({ url: "/ajax/search-food.php", type: 'GET', data: { 'search' : search }, dataType: 'json' }).done(
      function(data){
         if (data[0] == 'success'){
            $('#add-food-area').html(data[1]);
            $('#add-food-area').fadeIn();
         }
      }
   ).always(function () {
       ajax = undefined;
   });
});

---

。。。尽管需要注意的是，取消AJAX请求并不总是阻止请求在服务器上完成。

将jqXHR对象存储在变量中，并每次中止它

var jqxhr = {abort: function () {}};
$(document).on("input", "#addFoodSearch", function(event){
    var search = $(this).val();
    jqxhr.abort();
    jqxhr = $.ajax(...

---

使用client-side.abort（），但大多数服务器语言将继续处理您的ajax请求，因为服务器不知道您已中止请求。请延迟ajax请求，使其仅在用户停止键入（例如2秒）时触发。

。始终

部分做什么？@RichardRodriguez:请参阅。在我们的例子中，无论ajax请求失败还是成功，它都会清除“ajax”变量，这样我们就不会“abort（）”已经完成的请求。+1，使用abort方法创建一个对象以避免错误是一个很好的方法。世界上最简单的解决方案。