javascript - AJAX 请求后函数语句被调用 1 次以上?

标签 javascript jquery

这是一个奇怪的标题,但我不确定如何描述正在发生的事情。

基本上,我有以下代码在发出 AJAX 请求后运行:

if (doAjax) {
    $("#loading").removeClass("visible");
    $("#loading").addClass("hidden");
    setTimeout(function () {
        $("#loading").css({
            "display": "none",
            "opacity": "0",
        });
    }, 300);
    if (number.length === 0) {
        $("#nothing").css("display", "inline-table");
        setTimeout(function () {
            $("#nothing").addClass("visible");
        }, 1);
    } else {
        setFavorite();
        checkFavorite();
    }
}

如果 AJAX 请求返回结果,那么它将运行 setFavorite();checkFavorite();功能一旦完成。我还能够在单击按钮时重新加载 AJAX 请求,然后该按钮也会在请求结束时运行这些功能。

问题是,如果用户加载该页面,它将运行 AJAX,并且一切正常。但是,如果用户再次调用 AJAX 请求,该函数将运行两次。如果再次调用,则运行 3 次。

所以,每次AJAX请求,次数setFavorite();checkFavorite();称为增加一。

我通过放置 alert 来确认这一点在 setFavorite() 内看看为什么它如此随机地调用,它总是被调用 x 次,其中 x 是用户重新加载 AJAX 请求的次数。

如果需要,我会发布 setFavorite();checkFavorite();功能,但我觉得错误在于 doAjax功能。

编辑 1

重新加载函数:

function reload(){
    doAjax("http://www.codekraken.com/testing/snowday/wgrz.html");
};

$("#reload").click(reload);

编辑二人组

doAjax();

function doAjax(url) {
    $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22" + encodeURIComponent(url) + "%22&format=xml'&callback=?",
    function (data) {
        if (data.results[0]) {
            $("#content").html("");
            var number = $(filterData(data.results[0])).find("#gtv_leftcolumn table:gt(1)");
            for (var i = 0; i < number.length; i++) {
                var school = $(filterData(data.results[0])).find("#gtv_leftcolumn table:gt(1) .maintext p:eq(" + i + ")").text();
                var type = $(filterData(data.results[0])).find("#gtv_leftcolumn table:gt(1) .trafficbriefs:nth-child(even) p:eq(" + i + ")").text();
                $("#content").append("<div class='row'><div class='row-inside'><div class='row-l'>" + school + "</div><div class='row-r'>" + type + "</div></div><div class='star'><div class='star-inside'></div></div></div>");
            };
            if (doAjax) {
                $("#loading").removeClass("visible");
                $("#loading").addClass("hidden");
                setTimeout(function () {
                    $("#loading").css({
                        "display": "none",
                        "opacity": "0",
                    });
                }, 300);
                if (number.length === 0) {
                    $("#nothing").css("display", "inline-table");
                    setTimeout(function () {
                        $("#nothing").addClass("visible");
                    }, 1);
                } else {
                    setFavorite();
                    checkFavorite();
                }
            }
        } else {
            console.log("error");
        }
    })
}

function filterData(data) {
    data = data.replace(/<?\/body[^>]*>/g, '');
    data = data.replace(/[\r|\n]+/g, '');
    data = data.replace(/<--[\S\s]*?-->/g, '');
    data = data.replace(/<noscript[^>]*>[\S\s]*?<\/noscript>/g, '');
    data = data.replace(/<script[^>]*>[\S\s]*?<\/script>/g, '');
    data = data.replace(/<script.*\/>/, '');
    data = data.replace(/<img[^>]*>/g, '');
    return data;
}

最佳答案

这听起来像是您在每次运行该函数时都绑定(bind)了重新加载按钮。这将多次运行该函数。

你能显示 setFavorite();和 checkFavorite();函数?

如果每次重新加载都必须重新绑定(bind)按钮,您可以在重新绑定(bind)之前取消绑定(bind)按钮。

关于javascript - AJAX 请求后函数语句被调用 1 次以上?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12962841/

相关文章:

javascript - Vue2 回调中发布 axios 请求无法正常工作

javascript - 提供的脚本使用 jQuery 的 $,但 drupal 站点没有启用冲突

jQuery 过滤和表格排序 - 如何查看 "inside"html 标签

javascript - highcharts,垂直对齐顶部的条形图图例不起作用

javascript - 如果访问者试图通过单击 "x"按钮关闭浏览器窗口,则触发函数

javascript - 使用 aws Secret Manager 配置 knexfile.js

javascript - 如何使用类名克隆元素并将其附加到正文

javascript - Grafana,编写一个简单的插件,不使用 grunt 或其他什么

javascript - Twitter Bootstrap 2 javascript 插件不工作

json - jQuery Ajax JSONP Post 调用 WCF 服务 moSTLY 收到 400 错误请求