ajax 正在用多个调用覆盖 XHR 对象 - jQuery

ajax is overwriting XHR object with multiple calls - jQuery

本文关键字：XHR 覆盖 对象 jQuery 调用 ajax      更新时间：2023-09-26

我有一个函数someFunction（），它通过jQuery发送ajax requets。

如果用户点击满意，请求似乎被覆盖了......我不知道为什么。

var request = $.ajax(customObject);
request.done(doneFunction);
request.fail(failFunction);

传递给doneFunction（）和failFunction（）的XHR对象在每次用户触发函数时都会被覆盖。

这是一个问题，因为doneFunction（）和failFunction（）使用带有回调的延迟动画在动画完成时更改html（派生自XHR对象）。

有什么想法/建议吗？

  • 注意我使用的是本地变量而不是全局变量...已经想到了...

您可以添加一个变量来检查请求是否已发送，并在完成之前阻止发送另一个请求。像这样：

var requestSent = false;
function someFunction() {
    if (!requestSent) {
        requestSent = true;
        $.ajax({
            url: [url],
            type: [type],
            data: [data],
            success: function (xhr) {
                doneFunction(xhr);
                requestSent = false;
            },
            failure: function (xhr) {
                failFunction(xhr);
                requestSent = false;
            }
        });
    }
}

一种简单的方法是隐藏或禁用按钮，直到 ajax 调用返回。 在someFunction()中，您可以禁用按钮，并显示"加载"微调器图像，然后在success和failure回调中，启用按钮，并删除"加载"微调器。

如果要允许多个请求，则需要实现队列，并串行进行 AJAX 调用。 基本上，创建一个对象来保存 AJAX 函数队列。 当一个请求返回时，调用下一个请求。 以下是一些示例：

  • 使用 jQuery 队列函数的小要点
  • 来自 Alex MacCaw 的 jQuery 插件
相关文章：