javascript - 多页倒数计时器

Question

我的主页上有一个计时器。当用户进行任何操作(例如鼠标移动)时，计时器将被重置。当计时器倒计时至 05:00 时，系统将弹出提醒，单击“确定”即可重置计时器。如果 5 分钟内没有任何操作且计时器倒计时至 00:00，则用户强制注销。我的问题是这个计时器仅在一页内工作，如果我打开了两个页面，计时器仅在焦点页面上重置。由于页面未聚焦，我仍然会注销。

有人可以帮我解决这个问题吗？非常感谢!

<script type="text/javascript">
  var flag = false;
  startTimer();
  function startTimer() {
    var presentTime = $("#Status").text().toString();
    var timeArray = presentTime.split(":");
    var m = timeArray[0];
    var s = checkSecond((timeArray[1] - 1));
    if(s==59) {
      m=m-1;
      if(m < 10) {
        m = "0" + m;
      }
    }

    if (m==05 && s==00) {
      flag = true;
      BootstrapDialog.alert("You have 5 minutes remaining in your session. Click \"OK\" to extend the session.", function() {
        flag = false;
        resetTimer();
      });
    }

    if(!flag) {
      //Reset timer upon user action
      document.onload = resetTimer;
      document.onmousemove = resetTimer;
      document.onmousedown = resetTimer;
      document.ontouchstart = resetTimer;
      document.onclick = resetTimer;
      document.onscroll = resetTimer;
      document.onkeydown = resetTimer;
    }
    else {
      document.onload = null;
      document.onmousemove = null;
      document.onmousedown = null;
      document.ontouchstart = null;
      document.onclick = null;
      document.onscroll = null;
      document.onkeydown = null;
    }

    if (m==0 && s==00) {
      window.location.replace("/Logout");
    };

    setTimeout(startTimer, 1000);
  }

  function checkSecond(sec) {
    if (sec < 10 && sec >= 0) {sec = "0" + sec};
    if (sec < 0) {sec = "59"};
    return sec;
  }

  function resetTimer() {
    $("#Status").html("30:00");
  }
</script>

<div> Your session has <h5 id="Status">30:00</h5> remaining. </div>

Answer 1

你的问题是你想通过1个脚本控制两个页面，但每个页面中的变量是独立的。

如果解决了这个问题，您就可以控制您的页面。

你可以从cookie或localstorage中获取变量m和s。如果 cookie 和 localstorage 中的变量位于同一根目录下，则可以在不同的页面中访问这些变量。

尝试一下，只需替换变量。从cookie或本地存储中获取&&设置它