JavaScript倒计时函数
时间: 2024-01-04 09:03:50 浏览: 36
下面是一个简单的 JavaScript 倒计时函数:
```javascript
function countdown(endDate) {
var days, hours, minutes, seconds;
endDate = new Date(endDate).getTime();
if (isNaN(endDate)) {
return;
}
setInterval(calculate, 1000);
function calculate() {
var startDate = new Date();
var diff = parseInt((endDate - startDate.getTime()) / 1000);
if (diff <= 0) {
days = 0;
hours = 0;
minutes = 0;
seconds = 0;
} else {
days = Math.floor(diff / (24 * 60 * 60));
diff = diff - (days * 24 * 60 * 60);
hours = Math.floor(diff / (60 * 60));
diff = diff - (hours * 60 * 60);
minutes = Math.floor(diff / 60);
diff = diff - (minutes * 60);
seconds = diff;
}
document.getElementById("days").innerHTML = pad(days, 2);
document.getElementById("hours").innerHTML = pad(hours, 2);
document.getElementById("minutes").innerHTML = pad(minutes, 2);
document.getElementById("seconds").innerHTML = pad(seconds, 2);
}
function pad(num, size) {
var s = "0000" + num;
return s.substr(s.length - size);
}
}
```
这个函数接受一个日期字符串作为参数(例如:"2022-01-01"),并将其转换为日期对象。然后,它使用 setInterval() 函数每秒钟调用一次 calculate() 函数,计算距离结束日期还有多少时间。最后,倒计时的天数、小时数、分钟数和秒数被显示在 HTML 元素中。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)