即使在 Jquery 中刷新页面，如何保持 setInterval 函数？答案

【问题标题】：How to persist setInterval function even when page is refreshed in Jquery?即使在 Jquery 中刷新页面，如何保持 setInterval 函数？
【发布时间】：2018-04-11 00:24:18
【问题描述】：

我想在某个时间间隔执行一个函数，我可以使用 setInterval 来实现，但问题是，每次我刷新页面时，setInterval 的计数器都会重新启动！

那么，如何在页面刷新的情况下以一定的间隔执行函数呢？

 setInterval(function(){
   console.log("test"); //function is called here              
   }, 10000);

即使页面刷新，也必须每 10 秒执行一次！

【问题讨论】：

标签： javascript jquery

【解决方案1】：

这是一个使用localStorage 来节省时间的实现：

function setupInterval (callback, interval, name) {
  var key = '_timeInMs_' + (name || '');
  var now = Date.now();
  var timeInMs = localStorage.getItem(key);
  var executeCallback = function () {
    localStorage.setItem(key, Date.now());
    callback();
  }
  if (timeInMs) { // User has visited
    var time = parseInt(timeInMs);
    var delta = now - time;
    if (delta > interval) { // User has been away longer than interval
      setInterval(executeCallback, interval);
    } else { // Execute callback when we reach the next interval
      setTimeout(function () {
        setInterval(executeCallback, interval);
        executeCallback();
      }, interval - delta);
    }
  } else {
    setInterval(executeCallback, interval);
  }
  localStorage.setItem(key, now);
}

setupInterval(function () {
  console.log("test"); // function is called here
}, 10000);

【讨论】：

【解决方案2】：

如果您想在页面刷新后仍保留数据，则必须为此使用localStorage。

您可以使用以下代码设置和获取您的计数器值

localStorage.setItem(key,value); 设置
localStorage.getItem(key); 获取。

注意localstorage中存储的值是字符串格式，所以在使用get函数获取计数器值时需要将其转换为整数。

有关本地存储的更多信息，您可以参考以下帖子。 Setting and getting localStorage with jQuery

【讨论】：

好的，但是如何设置setInterval定时器的当前状态并在页面刷新后获取呢？
你的意思是说，当 setInetrval 函数被调用 10 秒定时器复位并假设 6 秒后页面被刷新，那么 setInterval 函数应该在 4 秒内第一次被调用刷新页面，然后在 10 秒内再次刷新？
是的。确切地！应该是这样的！
无法获取SetInterval的时间。您必须创建自己的计时器，如帖子stackoverflow.com/questions/8578006/current-time-in-setinterval 中所述。