使用 Ajax 未定义中止或就绪状态

问题描述

我用波纹管代码得到了那个错误

未捕获的类型错误:无法读取未定义的属性“readyState”


当我尝试删除 readyState 以查看发生了什么时我收到了那个错误

TypeError: 无法读取未定义的属性 'abort'

get: function () {
    var ajaxReq = $.ajax({
            type: 'GET',url: data.url,dataType: "json",success: function (response,status) {
                callback(response);
            },beforeSend: function () {
                if (ajaxReq != 'ToCancelPrevReq' && ajaxReq.readyState < 4) {
                    ajaxReq.abort();
                }
            }
        });
}

功能与按键一起使用;

keypress: function () {
        setTimeout(function () {
            if ($(OnePageCheckout.Selector.CardNumber).val().length == 7) {
                $(".payment-installment-container").removeClass("d-none");
                InvUtility.Loader.open();
                var model = {
                    value: $(OnePageCheckout.Selector.CardNumber).val()
                }

                OnePageCheckout.OnCardNumberUpdate.event(model);
            }
        },1000)
        OnePageCheckout.OnCardNumberUpdate.init();
    },

按键多次发送请求,我想确保成功过程只工作一次

解决方法

您应该在调用 ajaxReq 之前声明 $.ajax(). 然后在尝试使用它之前检查它是否为空,而不是使用像 ToCancelPrevReq 这样的特殊值。

并且一旦您获得成功的响应,您可以重置它,以便下次按键可以再次发出 AJAX 请求。

var ajaxReq;
...
if (ajaxReq && ajaxReq.readyState < 4) {
  ajaxReq.abort();
}

$.ajax({
  type: 'GET',url: data.url,dataType: "json",success: function(response,status) {
    ajaxReq = null;
    callback(response);
  }
});

,

这段代码解决了我的问题

我在 get 函数之外定义了变量。如果我在 GET 函数中定义它,它会被当作一个新事务,因为它每次都会被清空。所以在相关函数之外定义它给出了正确的结果

var jqxhr = {abort: function () {}};

get: function(){    
  jqxhr.abort();
    var ajaxReq = $.ajax({
        type: 'GET',success: function (response,status) {
            callback(response);
        }
    });
}