如何在JS中使用date.now()创建秒表

How can I create a stopwatch using date.now() in JS?

本文关键字:now 创建 date JS      更新时间:2023-09-26

我想知道如何使用date.now创建一个简单的计数计时器。我想用date.now()来查找开始时间,用date.nnow()来获取当前时间,并用javascript减去两者来获取经过的时间?

这是我刚刚构建的一个,按底部的"运行代码片段"进行测试。如果需要进一步解释,请发表评论。

var prevTime, stopwatchInterval, elapsedTime = 0;
var updateTime = function () {
  var tempTime = elapsedTime;
  var milliseconds = tempTime % 1000;
  tempTime = Math.floor(tempTime / 1000);
  var seconds = tempTime % 60;
  tempTime = Math.floor(tempTime / 60);
  var minutes = tempTime % 60;
  tempTime = Math.floor(tempTime / 60);
  var hours = tempTime % 60;
  
  var time = hours + " : " + minutes + " : " + seconds + "." + milliseconds;
  
  $("#time").text(time);
};
$("#startButton").click(function () {
  if (!stopwatchInterval) {
    stopwatchInterval = setInterval(function () {
      if (!prevTime) {
        prevTime = Date.now();
      }
      
      elapsedTime += Date.now() - prevTime;
      prevTime = Date.now();
      
      updateTime();
    }, 50);
  }
});
$("#pauseButton").click(function () {
  if (stopwatchInterval) {
    clearInterval(stopwatchInterval);
    stopwatchInterval = null;
  }
  prevTime = null;
});
$("#resetButton").click(function () {
  $("#pauseButton").click();
  elapsedTime = 0;
  updateTime();
});
$(document).ready(function () {
  updateTime();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Time: <span id="time"></span><br>
<button id="startButton">Start</button>
<button id="pauseButton">Pause</button>
<button id="resetButton">Reset</button>

我没有看到Winestone的答案,所以我在jsFiddle中做了一个例子。

总之:

var start=Date.now(),
stop=Date.now(),
diff=stop-start;

您可能需要的所有剩余操作都是以毫秒为单位适当地格式化时间,并在开始和停止之间获得所需的延迟。