使用 jQuery 中止待处理/积压的 AJAX 请求答案

【问题标题】：Aborting pending / backlog of AJAX requests using jQuery使用 jQuery 中止待处理/积压的 AJAX 请求
【发布时间】：2013-06-04 14:00:53
【问题描述】：

我有以下脚本：

  $(document).ready(function(){
    $('#input').keyup(function(){
        sendValue($(this).val());   

    }); 

});
function sendValue(str){
    $.post("ajax.php",{ sendValue: str },
    function(data){
        $('#display').html(data.returnValue);
    }, "json");

}

该脚本用于即时搜索类型场景（如 Google），因此当用户在文本框中输入时，它会向服务器发送相当多的选择请求（尽管我已经使用 pconnect，因此没有重复的数据库连接)。

这是一个相当大的数据库，每次击键都作为 AJAX 请求发送，因此最终会积压大量未决请求。我希望它在每次发送新请求时停止/取消所有先前的请求（如果它们没有被发回）。

我查看了xhr.abort()，但我很确定它只会停止任何尚未发送的请求（而不是告诉服务器停止处理）。这可能没问题，但我仍然不知道如何在我的代码中实现它。

【问题讨论】：

标签： jquery ajax backlog

【解决方案1】：

您可以使用与此类似的方法，以便将最后一个请求存储在某个非全局范围内：

function getSendValueFunction(){
    var lastRequest;

    return function(str){
        if (lastRequest){
            lastRequest.abort(); // abort pending request
        }
        // assign pending request, when created
        lastRequest = $.post("ajax.php",{ sendValue: str },
        function(data){
            lastRequest = null; // clear pending request
            $('#display').html(data.returnValue);
        }, "json");

    }
}

var sendValue = getSendValueFunction();

请记住，getSendValueFunction 返回的函数对最后一个未决请求具有单独的寄存器。所以这将使他们有 2 个不同的待处理请求，完全分开：

var sendValue1 = getSendValueFunction();
var sendValue2 = getSendValueFunction();
sendValue1('aaa');
sendValue2('bbb');

【讨论】：