Question

我有一个每5秒符文一次的setinterval。这在页面加载时工作正常。

我有以下情况：

按间隔加载页面（工作）
按下按钮并加载新内容和停止间隔（工作）
一旦新内容不再被删除，请将其解散，返回第一个内容并再次开始间隔（不工作）
我有像window.blur这样的事件，它也会停止间隔，以便浏览器不会为所有丢失的间隔进行组合，如果我要更改标签或其他内容。请记住，如果我在步骤3之后更改选项卡然后返回到我的原始页面（执行模糊），则步骤3无法正常工作但。

注意此处加载的所有内容exept页面加载都是通过ajax调用完成的。

我的代码：

初始化：

        $.automation.worker.bindIntervalEvent("#TanksContent", "/Tank/GetTanks", function() {
            $.automation.tanks.tableInit();
        });

绑定功能：

    bindIntervalEvent: function (target, url, callback) {
        $(window)
            .on("focus.mine",
                function() {
                    $.automation.worker.setUpdateInterval(target, url, callback);
                })
            .on("blur",
                function() {
                    $.automation.worker.stopUpdateInterval();
                }).trigger("focus.mine");
    }

间隔功能：

    setUpdateInterval: function (target, url, callback) {
        if ($.automation.globals.globalInterval.value.length === 0) {

            $.automation.globals.globalInterval.value.push(window.setInterval(
                function () {
                    var options = {
                        loadTarget: target
                    }
                    $.automation.worker.getView(url,
                        function() {
                            if (callback)
                                callback();
                        },
                        options);
                },
                5000));
        }
    }

停止间隔的功能：

    stopUpdateInterval: function () {
        if ($.automation.globals.globalInterval.value.length === 0)
            return;

        console.log("deleting");

        for (var i = 0; i <= $.automation.globals.globalInterval.value.length; i++) {
            window.clearInterval($.automation.globals.globalInterval.value[i])

            $.automation.globals.globalInterval.value.splice(i, 1);
            console.log($.automation.globals.globalInterval.value.length);
        }
    }

我也删除了窗口绑定：

   unBindIntervalEvent: function() {
        $(window).off("focus.mine");
        $(window).unbind("blur");
    }

返回第3步：

我的getview函数回调中的sucess方法与我在开始时执行的方法相同代码：

        $(".updatelatest")
            .on("click",
                function () {
                    var _this = $(this);
                    var options = {
                        loadTarget:"#TanksContent"
                    }
                    $.automation.worker.getView("/Tank/GetTanks",
                        function (data) {
                            $(_this).switchClass("col-md-5", "col-md-1", 1000, function() {
                                $(_this).addClass("hidden");
                                $(".search").switchClass("col-md-5", "col-md-12", 1000, "easeInOutQuad");
                            })                                  
                            $.automation.tanks.tableInit();
                            $.automation.worker.bindIntervalEvent("#TanksContent", "/Tank/GetTanks", function () {
                                $.automation.tanks.tableInit();
                            });
                            $(window).trigger("blur");
                        }, options);
                });

但这不会启动间隔。它显然是初始化的，因为它在window.blur执行时有效，例如当我更改制表符时但由于某种原因，这不能超过它。

我尝试触发Windows模糊事件并且没有发生任何事情，我尝试触发我的自定义窗口事件“focuse.mine”但没有任何反应。

我在开发时没有注意到这一点，因为我打开了firebug，每次我检查脚本或css或控制台时都执行了模糊功能，所以我假设我的代码按预期工作但是现在它已经部署了，我注意到了这一点。

我的脑袋正在超越理性，我无法弄清楚我哪里出错了。

Answer 1

这是一个有趣的。我只是在调用setUpdateInterval（）时发现了功能直接它给了我desirered结果。

我意识到我让它们像我一样分裂的原因是因为模糊事件。触发“Focus.mine”以在用户返回页面时再次启动inteval。

如何清除javascript setinterval？

1 个答案: