我怎么能停止所有ajax请求并采取最新的请求？

Question

我有一个这样的按钮：

01 less than 0.2
02 from 0.2 up to 0.4
03 More than 0.4 up to 0.6 
04 More than 0.6 up to 0.8
05 More than 0.8  up to 1 

点击此按钮，一个ajax呼叫请求激活。如果我一直点击这个按钮然后我得到ajax请求的队列，它正在命中服务器并等待响应。但我想杀死所有这些请求，并希望采取最新的一个请求。

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

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

这里是小提琴：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));
});

修改

  

我无法禁用该按钮。有一些限制。

真的不确定原因，但接着尝试：

$('#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');
});

但请注意，这只是阻止客户端浏览器侦听先前的请求响应，而不是服务器来处理任何以前的请求。第一种方法是更好的方式imho。