Ajax 未定义 abort 或 readyState答案

【问题标题】：abort or readyState is undefined with AjaxAjax 未定义 abort 或 readyState
【发布时间】：2021-08-30 14:29:47
【问题描述】：

我得到了下面代码的错误；

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

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

TypeError: Cannot read property 'abort' of undefined

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();
    },

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

【问题讨论】：

为什么在发送 AJAX 请求之前检查就绪状态？在收到响应之前，它不会设置为 4。
您是否要中止 previous 请求？
是的 @Barmar Ajax 使用按键和按键发送请求这么多次，我想确保成功过程只工作一次。我能做些什么来安排这样的事情
您可以禁用按键事件，直到该 ajax 调用完成

标签： javascript jquery ajax abort readystate

【解决方案1】：

你应该在调用$.ajax().之前声明ajaxReq然后在尝试使用它之前检查它是否不为空，而不是使用像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);
  }
});

【讨论】：

【解决方案2】：

这段代码解决了我的问题

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

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

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

【讨论】：