JavaScript倒计时，将秒格式化为HH：MM：SS

Question

我有一个倒计时器，需要'秒'并将其格式化为HH：MM：SS格式。问题是第二次显示60。

这是我的代码，这是一个更大的类的一部分。关于最佳方式格式的任何建议，以便它不会使用'60'作为第二种方式。

谢谢！

formatSeconds: function (seconds) {

    secondsRemaining = seconds;
    hoursRemaining = Math.floor(secondsRemaining / (60 * 60));
    minutesRemaining = secondsRemaining % (60 * 60);

    hourMinutesRemaining = Math.floor(minutesRemaining / 60);
    minuteSecondsRemaining = minutesRemaining % 60;
    hourSecondsRemaining = Math.ceil(minuteSecondsRemaining);

    fHrs = this.formatNumber(hoursRemaining);
    fMins = this.formatNumber(hourMinutesRemaining);
    fSecs = this.formatNumber(hourSecondsRemaining);

    return fHrs + ':' + fMins + ':' + fSecs;
},

formatNumber: function (number) {
    var s = String(number);
    if (s.length == 1) {
        s = '0' + s;
    }
    return s;
}

Answer 1

更新：这是上一个功能的新版本。我注意到之前版本中的一个错误是由于当秒数接近一小时或分钟边界时浮点舍入错误。从概念上讲，数学是正确的，但实际上并不是在使用IEEE-754数字精度时。

---

以下是我编写的函数，我在代码中用于此目的：

function formatSeconds(secs) {
  function pad(n) {
    return (n < 10 ? "0" + n : n);
  }

  var h = Math.floor(secs / 3600);
  var m = Math.floor(secs / 60) - (h * 60);
  var s = Math.floor(secs - h * 3600 - m * 60);

  return pad(h) +":"+ pad(m) +":"+ pad(s);
}

演示

// Test harness
setInterval(demo(), 1000);

function demo() {
  var seconds = 36005;
  var $output = document.querySelector('.output');

  return function() {
    if (seconds >= 0) {
      $output.innerHTML = formatSeconds(seconds) + ' (' + seconds + ' seconds)';
      seconds--;
    }
  };
}

// The function
function formatSeconds(secs) {
  function pad(n) {
    return (n < 10 ? "0" + n : n);
  }

  var h = Math.floor(secs / 3600);
  var m = Math.floor(secs / 60) - (h * 60);
  var s = Math.floor(secs - h * 3600 - m * 60);

  return pad(h) + ":" + pad(m) + ":" + pad(s);
}

<div class="output"></div>

测试代码

这是一个基本的测试，用于验证这个新函数在没有边缘情况的情况下工作。

function formatSeconds(secs) {
  function pad(n) {
    return (n < 10 ? "0" + n : n);
  }

  var h = Math.floor(secs / 3600);
  var m = Math.floor(secs / 60) - (h * 60);
  var s = Math.floor(secs - h * 3600 - m * 60);

  return pad(h) + ":" + pad(m) + ":" + pad(s);
}

function countSeconds(str) {
  var parts = str.split(':');
  var h = parseInt(parts[0], 10);
  var m = parseInt(parts[1], 10);
  var s = parseInt(parts[2], 10);

  return h * 3600 + m * 60 + s;
}

function compare(secs) {
  return secs === countSeconds(formatSeconds(secs));
}

var falses = 0;
for (var i = 0; i < 999999; i++) {
  if (compare(i) === false) {
    falses++;
    console.log('Error: ' + i + ' Seconds');
  }
}

console.log(falses + ' errors');

Answer 2

稍微修改了pseudosavant的解决方案，因为我们不希望定时器在00:00停顿一秒钟，而计时器仍然在运行：

var s;
if(h === 0 && m === 0) {
    // last minute only has 59 seconds
    s = Math.ceil((secs / 60) % 1 * 59);
}
else {
    s = Math.floor((secs / 60) % 1 * 60);
}