如何将数字格式化为始终是小数点前的两位数
How to format a number to always be double digits before the decimal
我建立了一个倒计时时钟,我需要分钟和秒始终显示两位数。目前时钟工作完美,但当秒和分钟低于 2 位数时,它只显示个位数。 (比如 10 以下的任何东西。)是否有 jQuery .format() 或类似的东西来格式化我的输出数字?
这是我的 JS:
// Set the date we're counting down to
var countDownDate = new Date("March 27, 2019 00:00:00").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Output the result in an element with id="demo"
document.getElementById("countdown").innerHTML = '<div class="timer-wrapper"><div class="time">' + days + ':</div><span class="text">DAYS</span></div><div class="timer-wrapper"><div class="time">' + hours + ':</div><span class="text">HOURS</span></div><div class="timer-wrapper"><div class="time">' +
minutes + ':</div><span class="text">MINUTES</span></div><div class="timer-wrapper"><div class="time">' + seconds + '</div><span class="text">SECONDS</span></div>';
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "EXPIRED";
}
}, 1000);
这是我的 HTML:
<div class="countdown-timer-wrapper">
<div class="timer" id="countdown"></div>
</div>
提前致谢。 :)
使用("0" + number).slice(-2)
,格式化数字
试试下面的代码片段
// Set the date we're counting down to
var countDownDate = new Date("March 27, 2019 00:00:00").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = ("0" +Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))).slice(-2);
var minutes = ("0" + Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60))).slice(-2);
var seconds = ("0" + Math.floor((distance % (1000 * 60)) / 1000)).slice(-2);
// Output the result in an element with id="demo"
document.getElementById("countdown").innerHTML = '<div class="timer-wrapper"><div class="time">' + days + ':</div><span class="text">DAYS</span></div><div class="timer-wrapper"><div class="time">' + hours + ':</div><span class="text">HOURS</span></div><div class="timer-wrapper"><div class="time">' +
minutes + ':</div><span class="text">MINUTES</span></div><div class="timer-wrapper"><div class="time">' + seconds + '</div><span class="text">SECONDS</span></div>';
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "EXPIRED";
}
}, 1000);
<div class="countdown-timer-wrapper">
<div class="timer" id="countdown"></div>
</div>
我建立了一个倒计时时钟,我需要分钟和秒始终显示两位数。目前时钟工作完美,但当秒和分钟低于 2 位数时,它只显示个位数。 (比如 10 以下的任何东西。)是否有 jQuery .format() 或类似的东西来格式化我的输出数字?
这是我的 JS:
// Set the date we're counting down to
var countDownDate = new Date("March 27, 2019 00:00:00").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Output the result in an element with id="demo"
document.getElementById("countdown").innerHTML = '<div class="timer-wrapper"><div class="time">' + days + ':</div><span class="text">DAYS</span></div><div class="timer-wrapper"><div class="time">' + hours + ':</div><span class="text">HOURS</span></div><div class="timer-wrapper"><div class="time">' +
minutes + ':</div><span class="text">MINUTES</span></div><div class="timer-wrapper"><div class="time">' + seconds + '</div><span class="text">SECONDS</span></div>';
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "EXPIRED";
}
}, 1000);
这是我的 HTML:
<div class="countdown-timer-wrapper">
<div class="timer" id="countdown"></div>
</div>
提前致谢。 :)
使用("0" + number).slice(-2)
,格式化数字
试试下面的代码片段
// Set the date we're counting down to
var countDownDate = new Date("March 27, 2019 00:00:00").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = ("0" +Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))).slice(-2);
var minutes = ("0" + Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60))).slice(-2);
var seconds = ("0" + Math.floor((distance % (1000 * 60)) / 1000)).slice(-2);
// Output the result in an element with id="demo"
document.getElementById("countdown").innerHTML = '<div class="timer-wrapper"><div class="time">' + days + ':</div><span class="text">DAYS</span></div><div class="timer-wrapper"><div class="time">' + hours + ':</div><span class="text">HOURS</span></div><div class="timer-wrapper"><div class="time">' +
minutes + ':</div><span class="text">MINUTES</span></div><div class="timer-wrapper"><div class="time">' + seconds + '</div><span class="text">SECONDS</span></div>';
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "EXPIRED";
}
}, 1000);
<div class="countdown-timer-wrapper">
<div class="timer" id="countdown"></div>
</div>