首页 > 解决方案 > 同一网络会话中的永久计数器

问题描述

试图在网页上设置一个计数器,该计数器不会在同一用户会话中的每个不同页面视图上重新启动。当前使用此代码(感谢Praveen Kumar Purushothaman),但每次查看不同页面时此计数器都会重置。

setTimeout(start, 0);
var i = 0;
var num = document.getElementById("number");

function start() {
  increase();
  setInterval(increase, 1000);
}

function increase() {
  if (i < 100000) {
    i += 10.41;
    num.innerText = i.toFixed(2);
  }
}
<span id="number"></span>

标签: sessioncounter

解决方案


我的建议是将变量存储到会话存储中。我在评论中添加了更多细节:

setTimeout(start, 0);
// You're saving your current value here.
// Let's use localStorage. Set the i value if it doesn't exist for the first time.
if (!localStorage.getItem("i")) {
  localStorage.setItem("i", 0);
}
var num = document.getElementById("number");

function start() {
  increase();
  setInterval(increase, 1000);
}

function increase() {
  var i = localStorage.getItem("i");
  if (i < 100000) {
    i += 10.41;
    // When you're making any changes, make changes to the localStorage too.
    localStorage.setItem("i", i);
    num.innerText = i.toFixed(2);
  }
}

推荐阅读