【问题标题】:jQuery - replacing basic setTimeout with something more flexiblejQuery - 用更灵活的东西替换基本的 setTimeout
【发布时间】:2013-11-12 18:28:56
【问题描述】:

很久以前,当我第一次开始构建我的页面(用于系统监控)时,我补充说:

<script language="javascript" type="text/javascript">setTimeout("location.reload();",60000);</script>

使页面每 60 秒重新加载一次。

到目前为止,它一直运行良好。但它 [页面] 随着更多 PHP 和更多使用 JQuery 等而增长)。

我现在正在寻找一种方法来暂停 setTimeout / 然后稍后再恢复它。

我有一些 jQuery,当一个元素被右键单击时,它会加载一些数据,并显示一个带有该结果的小表格。但我希望它在显示该表时,页面不会刷新。当页面再次隐藏时,setTimeout 恢复。

最好的方法是什么? (注意,60000 目前是在 PHP 中通过配置变量设置的)。

【问题讨论】:

  • 看起来很糟糕的设计,但我假设它只是供您自己使用。要停止超时,只需使用 clearTimeout 清除它,然后随时重新启动它。作为旁注,有一个元标记(元刷新)会做同样可怕的事情。
  • 这个答案似乎正是您想要的:stackoverflow.com/a/3969760/191226

标签: jquery settimeout


【解决方案1】:

您不应该使用字符串来调用setTimeout 中的函数——这与使用eval() 一样糟糕。相反,您可以这样做:

var 
timeout = null,
start = function () {
    timeout = setTimeout(function () { location.reload(); }, 60000);
},
stop = function () {
    if (timeout) clearTimeout(timeout);
};

start();

// and, on button click, call:
stop();

【讨论】:

  • 干杯,它实际上比我尝试做的要简单得多。
【解决方案2】:

编辑

好的,我对我在这里制作的一些愚蠢的东西做了一些更新,现在它正在工作。 我还添加了用于调试的 console.log,因此您可以看到您在这篇文章中浪费的时间:]

var pageReloader = function () {

    var timeout = null,
        startTime = 0,
        remainingTime = 0,
        delay = 60;

    return {
        start: function () {
            startTime = (new Date()).getTime();
            remainingTime = delay * 1000;
            timeout = setTimeout(function () {
                location.reload();
            }, delay * 1000);

        },

        stop: function () {
            if (timeout) clearTimeout(timeout);
        },

        pause: function () {
            if (timeout) {
                clearTimeout(timeout);
                remainingTime = (remainingTime) - ((new Date()).getTime() - startTime);
                console.log(remainingTime); // DEBUG
            }
        },

        unpause: function () {
            if (timeout) {
                startTime = (new Date()).getTime();
                timeout = setTimeout(function () {
                    location.reload();
                }, remainingTime);
            }
        }
    };

}();

pageReloader.start();
pageReloader.pause();
pageReloader.unpause();

【讨论】:

    猜你喜欢
    • 2017-01-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-04-28
    • 1970-01-01
    • 2019-05-14
    • 1970-01-01
    相关资源
    最近更新 更多