php - 发出新请求时停止以前的 ajax

Question

我有一个脚本

$('#postinput').on('keyup',function(){ 
    var txt=$(this).val();

    $.ajax({
       type: "POST",
       url: "action.php",
       data: 'txt='+txt,
       cache: false,
       context:this,
       success: function(html)
       {
           alert(html);
       }

   });

});

假设有人键入一个 ,ajax 运行。他立即键入 bc 等等。Ajax 每次都运行。有没有办法在创建新请求时停止先前的请求？

Answer 1

您可以abort()使用xhr. 尝试这个：

var currentXhr;
$('#postinput').on('keyup',function(){ 
    currentXhr && currentXhr.readyState != 4 && currentXhr.abort(); // clear previous request

    var txt = $(this).val();
    var currentXhr = $.ajax({
        type: "POST",
        url: "action.php",
        data: 'txt=' + txt,
        cache: false,
        context:this,
        success: function(html) {
            alert(html);
        }
    });
});

如果您不想使用全局变量，则可以将 存储在元素xhr的data-*属性中。#postinput

另一种方法是仅在用户停止输入时触发 AJAX 请求：

var timer;
$('#postinput').on('keyup',function(){ 
    clearTimeout(timer);

    var txt = $(this).val();
    var timer = setTimeout(function() {
        $.ajax({
            type: "POST",
            url: "action.php",
            data: 'txt=' + txt,
            cache: false,
            context:this,
            success: function(html) {
                alert(html);
            }
        });
    }, 100); // sends request 100ms after typing stops.
});

Answer 2

你可以用 Jquery 做这样的事情-

jaxRequests = new Array();

queueRequest = function(whatever, you, want) {
    if(ajaxRequests[ajaxRequests.length - 1]) {
        ajaxRequests[ajaxRequests.length - 1].abort();
    }

    ajaxRequests[ajaxRequests.length] = //Insert New jQuery AJAX call here.
}