javascript - 如何存储不重置的测验的 JavaScript 计时器倒计时

Question

我需要帮助来存储此计时器倒计时的时间，它运行正常，但当我按刷新或浏览器返回时，计时器将重新启动，例如 15:00，然后计时器启动示例，如果我，时间为 9:00按刷新将返回到 15:00。

(function() {

    function display(notifier, str) {
      document.getElementById(notifier).innerHTML = str;
    }

    function toMinuteAndSecond(x) {
      return ~~(x / 60) + ":" + (x % 60 < 10 ? "0" : "") + x % 60;
    }

    function setTimer(remain, actions) {
      var action;
      (function countdown() {
        display("countdown", toMinuteAndSecond(remain));
        if (action = actions[remain]) {
          action();
        }
        if (remain > 0) {
          remain -= 1;
          setTimeout(arguments.callee, 1000);
        }
      })(); // End countdown
    }
    setTimer(900, {
        120: function() {
          display("notifier", "Just 1 minute to go");
        },
        50: function() {
          display("notifier", "50 seconds left");
        },

      }
    }
  );
})();

<span id="notifier"></span>

Answer 1

在 JS 中 - 请注意我放置 localStorage 的位置(它不在代码片段中运行)我还修复了发布的代码中的错误

(function() {

  function display(notifier, str) {
    document.getElementById(notifier).innerHTML = str;
  }

  function toMinuteAndSecond(x) {
    return ~~(x / 60) + ":" + (x % 60 < 10 ? "0" : "") + x % 60;
  }

  function setTimer(remain, actions) {
    var action;
    (function countdown() {
      // add localStorage.setItem("countdown",remain)
      display("countdown", toMinuteAndSecond(remain));
      if (action = actions[remain]) {
        action();
      }
      if (remain > 0) {
        remain -= 1;
        setTimeout(arguments.callee, 1000);
      }
      else display("countdown","Done");
    })(); // End countdown
  }
  setTimer(30, { // change 30 to +localStorage.getItem("countdown") || 30;
    20: function() {
      display("countdown", "Just 20 seconds to go");
    },
    10: function() {
      display("countdown", "10 seconds left");
    },
  });
})();

<span id="countdown"></span>