各种页面定时跳转(倒计时跳转)代码总结

最新推荐文章于 2024-02-14 17:30:00 发布

my_baby_2009

最新推荐文章于 2024-02-14 17:30:00 发布

阅读量1.4k

点赞数

分类专栏： Javascript相关

Javascript相关专栏收录该内容

99 篇文章 0 订阅

订阅专栏

下面对实现页面定时跳转（也称倒计时跳转）做一下总结，各种定时跳转代码记录如下：

（1）使用setTimeout函数实现定时跳转（如下代码要写在body区域内）

复制代码代码如下:

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

（2）html代码实现，在页面的head区域块内加上如下代码

复制代码代码如下:

 
 <!--5秒钟后跳转到指定的页面-->  
 
 <meta http-equiv="refresh" content="5;url=http://www.jbxue.com" />

（3）稍微复杂点，多见于登陆之后的定时跳转

复制代码代码如下:

 
 <!doctype html>  
 
 <head>  
 
 <meta charset=utf-8" />  
 
 <title>js定时跳转页面的方法-www.jbxue.com</title>  
 
 </head>  
 
 <body>  
 
 <script>  
 
 var t=10;//设定跳转的时间  
 
 setInterval("refer()",1000); //启动1秒定时  
 
 function refer(){  
 
 if(t==0){  
 
 location="http://www.jbxue.com"; //#设定跳转的链接地址  
 
 }  
 
 document.getElementById('show').innerHTML=""+t+"秒后跳转到百度"; // 显示倒计时  
 
 t--; // 计数器递减  
 
 //本文转自：  
 
 }  
 
 </script>  
 
 <span id="show"></span>  
 
 </body>  
 
 </html>