通过Date()函数和Interval()函数结合水仙花数原理求时间动态变化实现时间减减倒计时
实现代码如下
<!DOCTYPE html>
<html>
<head>
<title>倒计时示例</title>
</head>
<body>
<div id="countdown"></div>
<script>
var countdownElement = document.getElementById('countdown');
var endTime = new Date(); // 获取当前时间
endTime.setHours(endTime.getHours() + 2); // 设置考试结束时间为2小时后
function updateCountdown() {
var now = new Date(); // 获取当前时间
var timeDiff = endTime - now; // 计算剩余时间的毫秒数
if (timeDiff <= 0) {
clearInterval(timer); // 倒计时结束，清除定时器
countdownElement.innerHTML = "考试时间结束!";
} else {
var hours = Math.floor(timeDiff / 3600000); // 计算剩余小时数
var minutes = Math.floor((timeDiff % 3600000) / 60000); // 计算剩余分钟数
var seconds = Math.floor((timeDiff % 60000) / 1000); // 计算剩余秒数
hours = (hours < 10) ? "0" + hours : hours;
minutes = (minutes < 10) ? "0" + minutes : minutes;
seconds = (seconds < 10) ? "0" + seconds : seconds;
var countdownDisplay = hours + ":" + minutes + ":" + seconds;
countdownElement.innerHTML = "考试倒计时：" + countdownDisplay;
}
}
updateCountdown(); // 首次调用更新倒计时
var timer = setInterval(updateCountdown, 1000); // 每秒调用一次更新倒计时
</script>
</body>
</html>
实现效果如下
783
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
