Question

当新请求正在运行时，我想阻止先前的ajax请求。我这样做像下面的代码。但是，它不起作用。

我在beforeSend（）函数中添加了代码以中止先前的请求。但是，那是行不通的。

请帮助我解决这个问题。

jQuery：

return Component.extend({
    defaults: {
        changeTextValue: ko.observable(),
        currentRequest: ko.observable(),
        anotherObservableArray: [],
        subscription: null,
        tracks: {
            changeTextValue: true
        }
    },
    initialize: function() {
        this._super();
    },
    doSomething: function(config) {
        var self = this;
        if (this.subscription)
            this.subscription.dispose();

        this.subscription = this.changeTextValue.subscribe(function(newValue) {
            this.currentRequest = $.ajax({
                url: urlBuilder.build('abc/temp/temp'),
                type: 'POST',
                data: JSON.stringify({
                    'searchtext': newValue
                }),
                global: true,
                contentType: 'application/json',
                beforeSend: function(jqXHR) {
                    console.log("before Ajax send");
                    console.log(this.currentRequest);
                    if (this.currentRequest != null) {
                        this.currentRequest.abort();
                    }
                },
                success: function(response) {
                    var json_data = JSON.parse(response);
                    self.autocompleteData.removeAll();
                    $.each(json_data, function(key, val) {
                        self.autocompleteData.push({
                            productID: val.productID
                        });
                    });
                },
                error: function(jqXHR, exception) {
                    alert("Not OK!")
                }
            });
        });
    },
});
ko.applyBindings(new CeremonyViewModel());

Answer 1

所以我猜想您想在再次调用subscribe函数时取消上一个请求，对吗？

在这种情况下，如果再次调用subscribe，请尝试中止它。

return Component.extend({
    defaults: {
        changeTextValue: ko.observable(),
        currentRequest: null,
        anotherObservableArray: [],
        subscription: null,
        tracks: {
            changeTextValue: true
        }
    },
    initialize: function() {
        this._super();
    },
    doSomething: function(config) {
        var self = this;
        if (this.subscription)
            this.subscription.dispose();

        this.subscription = this.changeTextValue.subscribe(function(newValue) {
            if (self.currentRequest) {
                self.currentRequest.abort();
            }
            self.currentRequest = $.ajax({
                url: urlBuilder.build('abc/temp/temp'),
                type: 'POST',
                data: JSON.stringify({
                    'searchtext': newValue
                }),
                global: true,
                contentType: 'application/json',
                success: function(response) {
                    var json_data = JSON.parse(response);
                    self.autocompleteData.removeAll();
                    $.each(json_data, function(key, val) {
                        self.autocompleteData.push({
                            productID: val.productID
                        });
                    });
                },
                error: function(jqXHR, exception) {
                    alert("Not OK!")
                }
            });
        });
    },
});
ko.applyBindings(new CeremonyViewModel());

淘汰赛：Ajax请求中止

1 个答案: