使用js制作倒计时跳转

最新推荐文章于 2023-02-08 16:36:59 发布

奔跑的小猪

最新推荐文章于 2023-02-08 16:36:59 发布

阅读量217

点赞数

分类专栏： javascript html+css

本文链接：https://blog.csdn.net/sleeping_xixi/article/details/80291545

版权

html+css 同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

javascript

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<title>TimeOut</title>
	<script>
		var num=5;
		function showNum(){
		    document.getElementById("time").innerHTML=num;
		    num=num-1;
		    if(num>=0){
		        var i=setTimeout("showNum()",1000);
		    }else{
		        clearTimeout(i);
		        window.open("http://www.baidu.com","_parent");
		   }
		}
		window.οnlοad=showNum;
		
		function historyPage(){
			window.history.back();
		}
	</script>
</head>
<body>
<h2>操作成功</h2>
<p><span id="time"></span>秒后回到主页&nbsp;&nbsp;<a href="javascript:historyPage()">返回</a></p>
</body>
</html>

实现后的页面如下，比较简单。主要是完成一个5秒倒计时，然后跳转到一个新的页面。

值得注意的是：使用window.οnlοad=方法名，对方法进行加载。也可以使用<body οnlοad="showNum">进行加载。否则是无法调用函数的。