jquery - 计时器格式不正确

Question

我目前有一个计时器，它完全按照我想要的方式工作，除了倒计时时它显示 2:0 而它应该显示 2:00。它还将 1:00,1:01,1:02 等显示为 1:0,1:1,1:2 等。但是 1:59 到 1:11 和 0:11 到 0:59 确实显示正确。基本上它具有并正确显示 0-9 秒。这是我的代码和代码笔

js

 $(function () {
  var $startTimer = $('#startTimer');
  var $timerDisplay = $('#timerDisplay');
  var time = 120;

  $timerDisplay.hide();

  $startTimer.click(function () {
    $startTimer.prop('disabled', true);
    $timerDisplay.show();
    var timeRemaining = time;
     var intervalId = setInterval(function () {
     var timeStamp = Math.floor(timeRemaining/60) + ':' +    timeRemaining%60;
       $timerDisplay.text(timeStamp);
         if (timeRemaining === 0) {
         clearInterval(intervalId);
        $timerDisplay.fadeOut();
        alert('Time is up, please submit a vote :)');
        $startTimer.prop('disabled', false);
        } else {
        timeRemaining--;
      }
    }, 1000);
  });
});

html

<div id="timerDisplay"></div>
<button id="startTimer">Start Timer</button>

这是一个codepen http://codepen.io/Chevex/pen/RNomGG

Answer 1

您需要对 timeRemaining%60 给出的数字进行零填充

有很多方法可以在 Javascript 中进行零填充。

对于这个应用程序，因为它是特定的，我建议替换:

var timeStamp = Math.floor(timeRemaining/60) + ':' +    timeRemaining%60;

与

var seconds = timeRemaining%60;
seconds = ("0" + seconds).slice (-2);
var timeStamp = Math.floor(timeRemaining/60) + ':' +  seconds;

这通过每隔可变秒填充零然后取最后两位数来工作 - 例如0 变成了 00，但是 57 变成了 057，但是切片取了最后两个。