下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。
1）html的实现
<head>
<meta http-equiv="refresh" content="5;url=hello.html">
</head>
优点：简单
缺点：Struts Tiles中无法使用
2）javascript的实现
<script language="javascript" type="text/javascript">
setTimeout("javascript:location.href='hello.html'", 5000);
</script>
优点：灵活，可以结合更多的其他功能
缺点：受到不同浏览器的影响
3）结合了倒数的javascript实现（IE）
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
var second = totalSecond.innerText;
setInterval("redirect()", 1000);
function redirect(){
totalSecond.innerText=--second;
if(second<0) location.href='hello.html';
}
</script>
优点：更人性化
缺点：firefox不支持（firefox不支持span、div等的innerText属性）
3'）结合了倒数的javascript实现（firefox）
<script language="javascript" type="text/javascript">
var second = document.getElementById('totalSecond').textContent;
setInterval("redirect()", 1000);
function redirect()
{
document.getElementById('totalSecond').textContent = --second;
if (second < 0) location.href = 'hello.html';
}
</script>
4）解决Firefox不支持innerText的问题
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
if(navigator.appName.indexOf("Explorer") > -1){
document.getElementById('totalSecond').innerText = "my text innerText";
} else{
document.getElementById('totalSecond').textContent = "my text textContent";
}
</script>
5）整合3）和3'）
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
var second = document.getElementById('totalSecond').textContent;
if (navigator.appName.indexOf("Explorer") > -1)
{
second = document.getElementById('totalSecond').innerText;
} else
{
second = document.getElementById('totalSecond').textContent;
}
setInterval("redirect()", 1000);
function redirect()
{
if (second < 0)
{
location.href = 'hello.html';
} else
{
if (navigator.appName.indexOf("Explorer") > -1)
{
document.getElementById('totalSecond').innerText = second--;
} else
{
document.getElementById('totalSecond').textContent = second--;
}
}
}
</script>
分享到：
相关推荐
本文通过五个实例给大家介绍html实现页面自动跳转的五种方法，对html页面跳转相关知识感兴趣的朋友一起学习吧
js实现网页自动跳转倒计时！html新手必备！html新手必备！html新手必备！html新手必备！
自动跳转页面 简单明了 直接把里面的跳转代码复制到网页开头 就会自动跳转到另一个指定的页面
就想弄一个winform结合html5的一个小东西，突有心血来潮，想在里面嵌套一个微信网页版，下面小编给大家介绍下HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法，一起看看吧
<html> 页面跳转 ;url=http://ih123.com:8999"> 此页面三秒后跳转到http://ih123.com:8999 </html> 最简单的html网页跳转代码。。
在练习中，我们常常遇到一种问题就是，怎么实现页面N秒之后自动跳转呢？ 我自己遇到问题和查找资料，总结了3个方法 方法1： 最简单的一种：直接在前面<head>里面添加代码： 复制代码代码如下:...
404页面2秒内自动跳转到首页 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> ...
HTML页面跳转的方法HTML页面跳转的5种方法 下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。 html的实现
两个域名同一个空间自动跳转的ASP代码，html中跳转最全代码
网页自动跳转代码,html,有进度条,先打开“说明”文件看效果。
Ayurep404 v1.0 经营了几年的网站要换域名，是不是很痛苦。百度Google都已经收录了大部分页面，一换域名不是...3.建议自己再做个index.html的js延迟10秒自动跳转页。 www.CDQY.com 成都企业网 ayurep作品 2011.11.22
实现html页面5秒后自动跳转 代码片段 html
自动刷新页面+自动跳转和关闭： JavaScript是一种扩展到HTML的脚本设计语言，它使网页开发者可以更有效地控制页面
java五种jsp页面跳转方法详解 2009-08-21 09:06 1. RequestDispatcher.forward() 是在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servlet or JSP到 另外一个Servlet,JSP 或普通HTML...
功能介绍： 在浏览器网页中打开，点击“打开微信添加”会自动复制微信号，并且弹出添加好友界面带添加教程，点“打开微信添加好友”会直接拉起微信！
java实现手机扫描二维码后网站跳转新页面，提供zxing和hutools的方式实现二维码的生成，动态刷新，验证跳转功能。
暂时未能找到您查找的页面可能输入的网址错误或此页面不存在5秒后自动跳转到主页
js 特效 html 特效 网页限时跳转 js 特效 html 特效 网页限时跳转
没有用户操作的情况下，10秒后自动跳转至登录页面。