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); 
}