如果以前正在运行，如何取消$ .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(); 
     } 
     } 
    ); 
});

我想要做的是取消了之前的$就请求，如果有正在运行，如果用户键入太快。我只需要最新的请求通过，而不是他们的整个序列。

我该怎么做？

来源

2013-05-25 Richard Rodriguez

使用客户端.abort（），但大多数服务器的语言将继续处理您的Ajax请求，因为服务器不知道你已经中止它 –

将延迟对Ajax请求只火当用户停止输入比如说，2秒？ – naththedeveloper

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

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

来源

2013-05-25 15:26:33

+1，用中止方法创建一个对象以避免错误是一个很好的接触。 – adeneo

在宇宙中找到最简单的解决方案。 – TNC

您需要存储正在进行的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请求并不总是阻止请求在服务器上完成。

来源

2013-05-25 15:26:07 Matt

''.always''部分是做什么的？ –

@RichardRodriguez：见http://api.jquery.com/deferred.always/。在我们的例子中，无论AJAX请求失败还是成功，它都会清除“ajax”变量，这样我们就不会“中止”已经完成的请求。 – Matt

如果以前正在运行，如何取消$ .ajax请求？

回答

相关问题