实现60秒倒计时显示java script
时间: 2024-09-15 12:01:46 浏览: 73
在JavaScript中实现一个60秒倒计时显示可以通过使用`setInterval`函数来每秒更新显示的时间。以下是一个简单的例子:
```javascript
// 设置倒计时的初始时间
var countDownDate = new Date().getTime() + 60000;
// 每秒更新一次倒计时
var x = setInterval(function() {
// 获取当前时间
var now = new Date().getTime();
// 计算剩余时间
var distance = countDownDate - now;
// 时间计算
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// 显示倒计时
document.getElementById("countdown").innerHTML = seconds + "秒 ";
// 如果时间到了,停止倒计时
if (distance < 0) {
clearInterval(x);
document.getElementById("countdown").innerHTML = "倒计时结束";
}
}, 1000);
```
在这段代码中,首先设置了一个`countDownDate`变量来存储60秒后的时间点。然后使用`setInterval`函数每1000毫秒(1秒)执行一次函数。在这个函数中,计算当前时间和`countDownDate`之间的时间差,然后通过取余和除法操作计算出剩余的秒数,并将这个秒数显示在页面上。当时间到达或超过倒计时设定的时间时,使用`clearInterval`函数停止定时器,并显示"倒计时结束"。
阅读全文