meta标签和JS实现页面刷新与重定向
下面列了五个例子来详细说明,这几个例子的主要功能是:在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实现页面刷新与重定向的更多相关文章
- js中页面刷新和页面跳转的方法总结
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- js当前页面刷新并且清空文本内容的方法
js当前页面刷新并且清空文本内容的方法: 1.js代码:location.reload(); 2.html:<body onload="document.forms[0].reset( ...
- 实现网页页面跳转的几种方法(meta标签、js实现、php实现)
1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面 代码如下 复制代码 1 <meta http-equiv="refresh&quo ...
- 实现网页页面跳转的几种方法大全(meta标签、js实现、php实现)
1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面 代码如下 复制代码 1 <meta http-equiv="refresh&quo ...
- JS实现页面刷新方法
下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...
- 用js判断页面刷新或关闭的方法
Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于on ...
- jQuery、js全页面刷新方法
下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...
- JS 控制页面刷新
.页面自动刷新:把如下代码加入<head>区域中 <meta http-equiv=">,其中20指每隔20秒刷新一次页面. .页面自动跳转:把如下代码加入<h ...
随机推荐
- spring boot 学习(四)Druid连接池的使用配置
Druid介绍 Druid是一个JDBC组件,druid 是阿里开源在 github 上面的数据库连接池,它包括三部分: * DruidDriver 代理Driver,能够提供基于Filter-Cha ...
- js 实现智能输入数字
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...
- python自动化运维之路06
python中面向对象编程 编程范式: 编程是 程序 员 用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程 , 一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条 ...
- TMemo的ScrollBars属性和大文本
给TMemo.Text := '几M大的文本'; 如果 ScrollBars 不是 sbBoth的话,程序很可能 无响应. 今天郁闷了半天才发现的.
- jquery 中事件
jQuery 事件 - submit() 方法 定义和用法 当提交表单时,会发生 submit 事件. 该事件只适用于表单元素. submit() 方法触发 submit 事件,或规定当发生 subm ...
- ue使用
快捷键CTRL+V:输入代码提示自动补全 编辑器Ultraedit快捷键 说到编辑器的快捷键,VIM是无与伦比的.要反对,也得是带脚踏板的EmaCS.UE还是有差距的,很大差距.注意:VIM是开 ...
- ubuntu 安装最新的python3.7.0
原文:https://www.cnblogs.com/ningvsban/p/4384995.html 1. 安装pyenv git clone git://github.com/yyuu/pyenv ...
- 修改类不重启tomcat 自动加载项目
可以修改类不用重启Tomcat加载整个项目(手工启动) 配置reloadable=true(自动重载) 使用Debug模式,前提是仅限于局部修改.(修改类不用重启--热加载) Tomc ...
- Windows 7 64bit Python 2 Install
安装 setuptools 出现 UnicodeDecodeError 文件 Lib/mimetypes.py 中的 bug, 通过以下 patch 修复: Index: Lib/mimetypes. ...
- Ubuntu16.04 和 hadoop2.7.3环境下 hive2.1.1安装部署
参考文献: http://blog.csdn.NET/reesun/article/details/8556078 http://blog.csdn.Net/zhongguozhichuang/art ...