html倒计时关闭窗口的代码刷新倒计时时间不会重置
以下是一个示例代码,实现了倒计时并在倒计时结束时自动关闭窗口。刷新页面后,倒计时时间不会重置。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>倒计时关闭窗口</title>
<script>
var countDown = 10; // 倒计时时间,单位为秒
var timer = null; // 定时器变量
function startCountDown() {
timer = setInterval(function() {
countDown--;
document.getElementById("countdown").innerHTML = countDown;
if (countDown <= 0) {
clearInterval(timer);
window.close();
}
}, 1000);
}
window.onload = function() {
startCountDown();
}
window.onbeforeunload = function() {
clearInterval(timer);
}
</script>
</head>
<body>
<p>本窗口将在<span id="countdown"></span>秒后自动关闭。</p>
</body>
</html>
在这个示例中,我们使用了一个全局变量 countDown 来记录倒计时剩余时间,以及一个定时器变量 timer 来控制倒计时的执行。在页面加载完成后,我们调用 startCountDown() 函数来启动倒计时。该函数会每秒钟减少一秒钟的倒计时时间,并将剩余时间更新到页面上的 countdown 元素中。当倒计时时间归零时,我们清除定时器并调用 window.close() 函数来关闭窗口。
同时,我们还在 window.onbeforeunload 事件中清除了定时器,以确保在用户刷新页面时倒计时时间不会重置
原文地址: https://www.cveoy.top/t/topic/cxtt 著作权归作者所有。请勿转载和采集!