阻止倒数计时器在 JavaScript 中重新启动

Question

我有以下JS代码，它显示了一个倒数计时器，它应该从每小时的00分钟开始，到10分钟结束。

@php
$dt = date('Y/m/d H:i:s');
@endphp
<script>
var countDownDate = new Date("Jan 5, 2100 23:10:00").getTime();
var now = new Date("<?php echo $dt; ?>").getTime();
var x = setInterval(function() {
now+= 1000
var distance = countDownDate - now;
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
document.getElementById("timer10").innerHTML = 
minutes + "m " + seconds + "s ";
}, 1000);

它工作正常，除了它没有停止 00：00 ，并且它会重置计时器，从 59：59 开始。我应该添加什么才能在 00：00 停止计时器？

Answer 1

你永远不会清除你的间隔。您需要调用clearInterval函数。

@php
$dt = date('Y/m/d H:i:s');
@endphp
<script>
var countDownDate = new Date("Jan 5, 2100 23:10:00").getTime();
var now = new Date("<?php echo $dt; ?>").getTime();
var x = setInterval(function() {
now+= 1000
var distance = countDownDate - now;
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
document.getElementById("timer10").innerHTML = 
minutes + "m " + seconds + "s ";
if(minutes === 0 && seconds === 0) {
clearInterval(x);
// the interval will stop at this point.
}
}, 1000);