javascript实现倒计时自动跳转页面

最新推荐文章于 2023-10-18 15:00:37 发布

原创最新推荐文章于 2023-10-18 15:00:37 发布 · 1.2k 阅读

5 ·

CC 4.0 BY-SA版权

javascript&jQuery 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了两种实现网页自动重定向的方法：使用setTimeout进行简单跳转，适用于不需要倒计时显示的场景；使用setInterval结合倒计时显示，适用于需要逐步减少时间并最终跳转的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.用setTimeout方法

<html>
<head>
<title>自动重定向</title>
</head>
<script type="text/javascript">
function go() {
	document.location.href="test2.html"     //重定向方法
}
setTimeout(go,3000);                        //3秒后执行该方法
</script>
<body>
<div>3秒后自动重定向</div>
</body>
</html>

3秒后直接跳转，没有倒计时提示

setTimeout(go,3000);//3秒后执行go方法

2.用setInterval方法

<html>
<head>
<title>自动重定向</title>
</head>
<script type="text/javascript">
var lefttime=10000;
function go() {
	document.getElementById("w").innerText=(lefttime)/1000;
	lefttime = lefttime - 1000;
	if(lefttime<0) {
	document.location.href="test2.html"     //重定向方法
	}
}
setInterval(go,1000);                      
</script>
<body>
<div><div id="w">10</div>秒后自动重定向</div>
</body>
</html>

setInterval(go,1000);  //每过一秒执行一次go方法

有上述代码可知，页面会10倒计时，之后自动跳转