JavaScript实现x秒后自动跳转

1、用一个response.sendRedirect("目标页面.jsp\.htm");实现直接跳转；

2、有时我们需要有点提示,比如“x秒后自动跳转，若没有跳转，请点击此处”，则可以在myeclipse中调用Snippets中的Delay Go To URL.会自动生成如下代码：

1. <script language="JavaScript1.2" type="text/javascript">  
2. <!--  
3. //  Place this in the 'head' section of your page.    
4. function delayURL(url, time) {  
5.     setTimeout("top.location.href='" + url + "'", time);  
6. }  
7. //-->  
8. </script>  
9.   
10. <!-- Place this in the 'body' section -->  
11. <a href="javascript:" onClick="delayURL('myPage.html','2000')">My Delayed Link</a>   

 

将此代码修改为：

 

1. <script language="JavaScript1.2" type="text/javascript">  
2. function delayURL(url, time) {  
3. setTimeout("top.location.href='" + url + "'", time);  
4. }  
5. </script>  
6. <span id="time" style="background: red">3</span>  
7. 秒钟之后自动跳转，如果不跳转，请点击下面链接  
8. <a href="目标页面.jsp">目标页面</a>  
9. <script type="text/javascript">  
10. delayURL("http://www.hualai.net.cn", 3000);  
11. </script>   

 

然后将在3秒钟之后直接跳转到“目标页面”。这种方法就是设定几秒钟后跳转则在这过程中页面不会有变化，比如说设定3秒，然后随着时间的变化3变成2再变成1直至跳转，下面请看第三种方法。

 

3、把方法2中的代码修改为：

1. <script language="JavaScript1.2" type="text/javascript">  
2. function delayURL(url) {  
3.    var delay=document.getElementById("time").innerHTML;  
4.    //最后的innerHTML不能丢，否则delay为一个对象  
5.    if(delay>0){  
6.    delay--;  
7.    document.getElementById("time").innerHTML=delay;  
8.    }else{  
9.    window.top.location.href=url;  
10.    }  
11. setTimeout("delayURL('" + url + "')", 1000);  
12. //此处1000毫秒即每一秒跳转一次  
13. }  
14. </script>  
15. <span id="time" style="background: red">3</span>  
16. 秒钟之后自动跳转，如果不跳转，请点击下面链接  
17. <a href="目标页面.jsp">主题列表</a>  
18. <script type="text/javascript">  
19. delayURL("http://www.hualai.net.cn/news/knowledge/265.html");  
20. </script>