javascript - 我怎样才能停止所有ajax请求并获取最新的请求？

Question

我有一个像这样的按钮:

<input type="button" id="getresult" value="getresult" />

通过单击此按钮，一个 ajax 调用请求处于事件状态。如果我继续点击这个按钮，我就会得到一个 ajax 请求队列，该请求正在发送到服务器并等待响应。但我想终止所有这些请求并希望接受最新的一个请求。

$('#getresult').click(function() {

var parameters = {data1:'value1',data2:'value2'};

$.post("getresult.php",parameters,function(msg){ 
    console.log(msg);
},'json');

});

我通过将请求分配给该变量来尝试xhr.abort();。但每当我单击按钮时，它就会中止所有请求。我无法收到最新的请求。例如。如果我点击按钮 6 次，那么将生成 6 个请求，然后我想取消前 5 个请求并继续进行第 6 个请求。

这是 fiddle :http://jsfiddle.net/s4pbn/308/

Answer 1

禁用按钮并在请求完成后重新启用它:

$('#getresult').click(function () {
    this.disabled = true;
    var parameters = {
        data1: 'value1',
        data2: 'value2'
    };

    $.post("getresult.php", parameters, function (msg) {
        console.log(msg);
    }, 'json').always(function () {
        this.disabled = false;
    }.bind(this));
});

编辑:

I cant disable the button. there is some limitation.

真的不知道为什么，但尝试一下:

$('#getresult').click(function () {
    if (this.pendingRequest) this.pendingRequest.abort();
    var parameters = {
        data1: 'value1',
        data2: 'value2'
    };

    this.pendingRequest = $.post("getresult.php", parameters, function (msg) {
        console.log(msg);
        this.pendingRequest = null;
    }, 'json');
});

但请注意，这只是停止客户端浏览器监听先前的请求响应，而不是服务器来处理任何先前的请求响应。第一种方法是更好的方法恕我直言。