如何制作一个从 20 到 0 并永远运行的计时器？答案

【问题标题】：How to make a timer starting from 20 to 0 and running forever?如何制作一个从 20 到 0 并永远运行的计时器？
【发布时间】：2021-10-10 19:34:14
【问题描述】：

我的意思是当我从 20 秒开始计时器，然后关闭浏览器，计时器继续在后台运行，当我再次打开它时，计时器会像 10 秒一样直到 0，然后从 20 秒再次重复，永远这样做。

我已经用 js 编写了这段代码，但问题是代码在客户端运行，这意味着当我退出并再次进入时，计时器将再次从 20 开始。

 <p id="demo"></p> 
    <script>
    var rtime = 4;
    const irtime = 4; // initial time for resetting  
    
        function rF(){
            setTimeout(() => {
            var x = document.getElementById("demo").innerHTML = rtime;
            if(rtime > 0){
                rtime-- ;
                rF();
            }else{
                rtime = irtime;
                rF();
            }
            }, 1000);
        }
        rF();
</script>

【问题讨论】：

标签： javascript php timer counter

【解决方案1】：

您可以将之前的时间存储在localStorage，然后在页面加载时检索时间并将其分配给rtime：

<p id="demo"></p>
<script>
  var rtime = localStorage.getItem("last-time");
  const irtime = 4; // initial time for resetting  
  rtime = !rtime ? 4 : rtime;

  function rF() {
    setTimeout(() => {
      var x = document.getElementById("demo").innerHTML = rtime;
      if (rtime > 0) {
        rtime--;
        rF();
      } else {
        rtime = irtime;
        rF();
      }
      localStorage.setItem("last-time", rtime)
    }, 1000);
  }
  rF();

</script>

演示：https://jsfiddle.net/Spectric/h8kgjo5d/

【讨论】：