时间戳

首页 > 解决方案 > 我如何让此代码每分钟更新一次？

javascript - 我如何让此代码每分钟更新一次？

问题描述

我一直在尝试制作倒数计时器，我希望显示剩余的时间。但是，当代码运行并且我设置为一个数字时，例如 5，剩下的时间只有 5，它不会继续更新。我将如何让它更新？

<!DOCTYPE html>
<html>

<head>
  <title>Timer</title>
</head>

<body>
  <div id="popup-content">
    <h6 id=title></h6>
    <p>Enter the time(in minutes) you want to spend on this page: </p>
    <input type="number" name="quantity" min="1" max="60" id="textBox">
    <button onclick="ductivity()" id="set">Set Timer</button> Time Left:
    <p id="timeLeft"></p>
  </div>
  <script>
    function ductivity() {
      var x = document.getElementById("textBox").value;
      var start = Date.now();
      var elapsed = (Date.now() - start) / 1000; //time elapsed in seconds
      var y = x - elapsed;
      if (y >= 0) {
        document.getElementById("timeLeft").innerHTML = y;
      } else {
        document.getElementById("timeLeft").innerHTML = "TIMES UP";
      }
    }
  </script>
</body>

</html>

标签： javascripthtml

解决方案

使用setInterval(). 在此处查看详细信息。

推荐阅读