倒数计时器不计数

Question

>> View On CodePen <<

我的剧本

var timer = 60;

var interval = setInterval(function() {
    timer--;

    var H  = Math.floor((timer % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var HH = (H < 9 ? "0" : "") + H;
    var M  = Math.floor((timer % (1000 * 60 * 60)) / (1000 * 60));
    var MM = (M < 9 ? "0" : "") + M;
    var S  = Math.floor((timer % (1000 * 60)) / 1000);
    var SS = (S < 9 ? "0" : "") + S;

    $('.timer').text(HH + ":" + MM + ":" + SS);
    if (timer === 0) clearInterval(interval);
}, 1000);

问题

嗯，我不确定在这里要问什么，我很确定这应该可以在网上获得基于jQuery的实时计时器的教程。我已设置timer，获取小时，分钟和秒，如果0添加value < 9，但脚本无效...

Answer 1

问题在于timer的价值。计算都是以毫秒为单位完成的，但我认为您使用秒timer。

我已经在下面的代码段中解决了这个问题。我还在顶部添加了三个变量，因此更容易定义计时器的起始值。您只需设置初始小时数，分钟数和秒数，然后就可以计算出毫秒数。

在示例中，我将初始值设置为03:00:08，因此您不必等待很长时间才能看到它跳到新的分钟和小时。

＆＃13;

＆＃13;

var timerH = 3;
var timerM = 0;
var timerS = 8;
var timer = (timerH * 60 * 60 * 1000) + (timerM * 60 * 1000) + (timerS * 1000);

var interval = setInterval(function() {
    timer -= 1000;
  
    var H  = Math.floor((timer % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var HH = (H < 9 ? "0" : "") + H;
    var M  = Math.floor((timer % (1000 * 60 * 60)) / (1000 * 60));
    var MM = (M < 9 ? "0" : "") + M;
    var S  = Math.floor((timer % (1000 * 60)) / 1000);
    var SS = (S < 9 ? "0" : "") + S;
  
    $('.timer').text(HH + ":" + MM + ":" + SS);
    if (timer === 0) clearInterval(interval);
}, 1000);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="timer">00:00:00</div>

＆＃13;

＆＃13;

＆＃13;