倒计时跳转总结

最新推荐文章于 2022-12-14 15:23:23 发布

东成熙就

最新推荐文章于 2022-12-14 15:23:23 发布

阅读量418

点赞数

分类专栏： Javascript HTML5 文章标签：定时跳转倒计时跳转

本文链接：https://blog.csdn.net/phpfer/article/details/49429835

版权

Javascript 同时被 2 个专栏收录

33 篇文章 1 订阅

订阅专栏

HTML5

18 篇文章 0 订阅

订阅专栏

三种方法实现定时跳转：

1. html代码实现，在页面的head区域块内添加。

<!-- 3秒之后跳转-->
<meta http-equiv="refresh" content="3;url=http://www.baidu.com" />

2. 使用setTimeout函数实现定时跳转。

<script type="text/javascript"> 
//3秒钟之后跳转到指定的页面 
setTimeout(window.location.href='http://www.baidu.com',3); 
</script>

3. JS定时跳转。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--<meta http-equiv="refresh" content="3"> HTML控制跳转-->
<title>Survey</title>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<style type="text/css">
	h3,label {
	font-size:11px;
	}
	button{
		cursor:pointer;
	}
</style>
</head>
<script type="text/javascript">
var t=3;//设定跳转时限 
var pid = setInterval("refer()",1000); //每秒运行一次
function refer(){  
    if(t==0){ 
        //location="http://www.baidu.com"; //跳转 
		clearInterval(pid);
    } 
    document.getElementById('th2ID').innerHTML=""+t+"秒后跳转到百度"; // 显示倒计时 
    t--; //计数器递减 
}
</script>
<body>
	<h2 id='th2ID'></h2>
</body>
</html>

Find more here: http://www.daimajiayuan.com/sitejs-17251-1.html