jQuery - 用更灵活的东西替换基本的setTimeout

时间:2013-11-01 14:26:18

标签: jquery settimeout

年龄之前,当我第一次开始构建我的页面时(用于系统监控),我添加了:

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

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

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

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

我有一些jQuery,当一个元素被右键单击时,它会加载一些数据,并显示一个包含该结果的小表。但我想要它,以便在显示该表时,页面不会刷新。然后再次隐藏页面时,setTimeout将恢复。

最好的方法是什么? (n.b. 60000当前是从配置变量中设置的。)

2 个答案:

答案 0 :(得分: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();

答案 1 :(得分:1)

修改

好的,我做了一些我在这里做的愚蠢事情的更新,现在它正在运作。 我还添加了console.log进行debuging,所以你可以看到你在这篇文章中浪费的时间:]

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