下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。
1) html的实现

 

1
2
3
4
5
6
<head>
<!-- 以下方式只是刷新不跳转到其他页面 -->
<meta http-equiv="refresh" content="10">
<!-- 以下方式定时转到其他页面 -->
<meta http-equiv="refresh" content="5;url=hello.html">
</head>

优点：简单
缺点：Struts Tiles中无法使用

2) javascript的实现

1
2
3
4
5
6
<script language="javascript" type="text/javascript">
// 以下方式直接跳转
window.location.href='hello.html';
// 以下方式定时跳转
setTimeout("javascript:location.href='hello.html'", 5000);
</script>

优点：灵活，可以结合更多的其他功能
缺点：受到不同浏览器的影响
3) 结合了倒数的javascript实现（IE）

1
2
3
4
5
6
7
8
9
<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）

1
2
3
4
5
6
7
8
9
<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的问题

1
2
3
4
5
6
7
8
<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')

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<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>

meta标签和JS实现页面刷新与重定向的更多相关文章

  1. js中页面刷新和页面跳转的方法总结

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  2. js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  3. js当前页面刷新并且清空文本内容的方法

    js当前页面刷新并且清空文本内容的方法: 1.js代码:location.reload(); 2.html:<body onload="document.forms[0].reset( ...

  4. 实现网页页面跳转的几种方法(meta标签、js实现、php实现)

    1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面  代码如下 复制代码 1 <meta http-equiv="refresh&quo ...

  5. 实现网页页面跳转的几种方法大全(meta标签、js实现、php实现)

    1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面  代码如下 复制代码 1 <meta http-equiv="refresh&quo ...

  6. JS实现页面刷新方法

    下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...

  7. 用js判断页面刷新或关闭的方法

    Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于on ...

  8. jQuery、js全页面刷新方法

    下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...

  9. JS 控制页面刷新

    .页面自动刷新:把如下代码加入<head>区域中 <meta http-equiv=">,其中20指每隔20秒刷新一次页面. .页面自动跳转:把如下代码加入<h ...

随机推荐

  1. spring cloud学习(五)断路器 Hystrix

    断路器 Hystrix 断路器模式 (云计算设计模式) 断路器模式源于Martin Fowler的Circuit Breaker一文. 在分布式环境中,其中的应用程序执行访问远程资源和服务的操作,有可 ...

  2. 如何合理的规划一次jvm性能调优

    https://blog.csdn.net/miracle_8/article/details/78347172 摘要: JVM性能调优涉及到方方面面的取舍,往往是牵一发而动全身,需要全盘考虑各方面的 ...

  3. C/S架构系统自动化测试入门

    所谓C/S架构即Client/Server(客户端/服务器架构).虽然近年来C/S架构产品越来越少,大有被B/S(Browser/Server 浏览器/服务器)架构超越的趋势,但C/S还是有B/S不可 ...

  4. o(1)取b > a,且b的二进制中1的个数等于a二进制中1的个数,且使b最小

    给你一个uint32 a,让你找到另一个uint32 b,使b > a,且b的二进制中1的个数等于a二进制中1的个数.且使b最小.(数据保证可出) 1 因为1的个数不变,所以必然大于n+lowb ...

  5. IE11浏览器，按F12 检查元素，工具会出来，但是没法正常使用？

    微软网站上找到IE11的累计安全更新,安装后就能正常使用了.https://www.microsoft.com/zh-cn/download/confirmation.aspx?id=45154

  6. html form method 属性不支持put,delete请求方式，以及开启spring mvc的rest的方式

    1.加上隐藏域解决form method 不支持put,delete的请求方式的问题 2.配置spring mvc HiddenHttpMethodFilter过滤器实现对put和delete请求方式 ...

  7. 一种简单的hook方法--LD_PRELOAD变量

    LD_PRELOAD这个变量允许你定义在程序运行时优先加载的动态链接库,从而在程序运行时的动态链接 下面程序的看一个例子-getuid.c //getuid.c #include<stdio.h ...

  8. Guided Image Filtering

    在图像滤波中,人们最希望的就是可以将图像中的噪声过滤掉的同时,能够让边缘尽可能的保持.噪声属于高频信号,而边缘其实也是一种高频信号,所以一般的滤波器,比如高斯模糊,均值模糊,都是一种低通滤波器,能够将 ...

  9. 一次delete基表回收DBA权限的危险性操作

    1.0事件还原:测试库某个对象,使用具有DBA角色用户导出,生产环境普通用户无法导入数据,因此需要回收测试库dba角色,revoke无法回收 2.0操作流程 回收角色报错 测试环境测试,delete删 ...

  10. 利用asynchttpclient开源项目来把数据提交给服务器

    可以通过github去查找asynchttpclient,并下载源代码,并加载到自己的工程中. 1.利用get方法提交 2.利用post方法来提交