我这里有一个倒计时,出于测试目的,我将其设置为10 秒,但一旦完善,我会将其设置为 30 分钟。一切都顺利进行,直到倒计时变成负数,我希望它是负数,但格式正确,并且不会从 0 跳转到 -01:00。 Math.Floor
似乎是个好主意,但使用这段代码它会立即运行负数。另外,一旦为负数,格式为 -00:0-0,我想要 -00:00。
格式为负数后如何修复?
请不要使用面向对象,我们的网络服务器已经过时了好几年。
var seconds = 10;
function secondPassed() {
var minutes = Math.round((seconds - 30)/60);
var remainingSeconds = seconds % 60;
if (remainingSeconds < 10)
{
remainingSeconds = "0" + remainingSeconds;
}
document.getElementById('countdown').innerHTML = minutes + ":" + remainingSeconds;
if (seconds > 0) {
seconds--;
if (seconds > 8) {
document.body.style.backgroundColor = "green"; }
else if (seconds == 8) {document.body.style.backgroundColor = "yellow";}
else if (seconds == 3) {document.body.style.backgroundColor = "red";}
}
else{
seconds--;
}
}
var countdownTimer = setInterval('secondPassed()', 1000);
<body onload = "getSeconds()">
<p align ="center">
<span id="countdown" style="color:black; font-size: 20px; font-weight: bold"> </span>
</p>
</body>
最佳答案
这是一个下取整函数,根据您的需要,将 -0.5 舍入为 0,将 -1.5 舍入为 -1:
function floor(x) {
return x | 0;
}
这是一个填充函数,它可以正确地用 0 填充整数:
function pad(n) {
if (n < 0) {
n = -n;
}
if (n < 10) {
return '0' + n.toString();
}
return n.toString();
}
您的代码变为:
<html>
<head>
<title>Countdown</title>
<script type="text/javascript">
var seconds = 10;
function floor(x) {
return x | 0;
}
function pad(n) {
if (n < 0) {
n = -n;
}
if (n < 10) {
return '0' + n.toString();
}
return n.toString();
}
function secondPassed() {
var minutes = pad(floor(seconds/60));
if (seconds < 0) {
minutes = '-' + minutes;
}
var remainingSeconds = pad(seconds % 60);
document.getElementById('countdown').innerHTML = minutes + ":" + remainingSeconds;
if (seconds > 0) {
seconds--;
if (seconds > 8) {
document.body.style.backgroundColor = "green"; }
else if (seconds == 8) {document.body.style.backgroundColor = "yellow";}
else if (seconds == 3) {document.body.style.backgroundColor = "red";}
}
else{
seconds--;
}
}
var countdownTimer = setInterval('secondPassed()', 1000);
</script>
</head>
<body onload = "getSeconds()">
<p align ="center">
<span id="countdown" style="color:black; font-size: 20px; font-weight: bold"> </span>
</p>
</body>
</html>
关于javascript - 如何避免javascript倒计时器不走负数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32210087/