在多个页面上倒数计时器

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或本地存储中获取和设置它