用html制作一个十秒倒计时界面,倒计时结束之后,alert弹窗显示,点击确认之后刷新界面。
时间: 2023-06-05 12:07:48 浏览: 90
可以使用以下代码实现:
```html
<!DOCTYPE html>
<html>
<head>
<title>Countdown</title>
<script>
function startCountdown() {
var countdown = 10; //倒计时开始时间
var countdownTimer = setInterval(function() { //设置定时器,每1秒执行一次
countdown--; //倒计时减1
document.getElementById("countdown").innerHTML = countdown.toString(); //将剩余时间显示在界面上
if (countdown == 0) { //倒计时结束
clearInterval(countdownTimer); //清除定时器
alert("倒计时结束!"); //弹出提示框
location.reload(); //页面刷新
}
}, 1000);
}
</script>
</head>
<body onload="startCountdown();">
<div id="countdown" style="font-size: 100px;"></div> <!-- 显示倒计时时间的div -->
</body>
</html>
```
这个页面会在加载完成后自动开始倒计时,每1秒自动减1,并且将剩余时间显示在界面上。当倒计时结束后,会弹出一个提示框,点击确定后会刷新页面。