使用javascript实现页面定时跳转总结篇


Posted in Javascript onSeptember 21, 2013

下面对使用JavaScript实现页面定时跳转(也称倒计时跳转)做一下总结,各种定时跳转代码记录如下:

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

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

(2)html代码实现,在页面的head区域块内加上如下代码
<!-- 5秒钟后跳转到指定的页面 --> 
<meta http-equiv="refresh" content="5;url=http://3aj.cn/javascript/19.html" />

(3)稍微复杂点,多见于登陆之后的定时跳转
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>js定时跳转页面的方法</title> 
</head> 
<body> 
<script type="text/javascript"> 
var t = 10; // 设定跳转的时间 
setInterval("refer()", 1000); // 启动1秒定时 
function refer(){ 
if (t == 0) { 
location = "http://3aj.cn/javascript/19.html"; // 设定跳转的链接地址 
} 
document.getElementById('show').innerHTML = "" + t + "秒后跳转到php程序员教程网"; // 显示倒计时 
t--; // 计数器递减 
} 
</script> 
<span id="show"></span> 
</body> 
</html>
Javascript 相关文章推荐
jquery中的常用事件bind、hover、toggle等示例介绍
Jul 21 Javascript
JavaScript隐式类型转换
Mar 15 Javascript
AngularJS中的指令全面解析(必看)
May 20 Javascript
JQueryEasyUI之DataGrid数据显示
Nov 23 Javascript
React Native中TabBarIOS的简单使用方法示例
Oct 13 Javascript
初识 Vue.js 中的 *.Vue文件
Nov 22 Javascript
微信小程序实现漂亮的弹窗效果
May 26 Javascript
利用原生的JavaScript实现简单拼图游戏
Nov 18 Javascript
vue的列表交错过渡实现代码示例
May 05 Javascript
移动端 Vue+Vant 的Uploader 实现上传、压缩、旋转图片功能
Jun 10 Javascript
JS中FormData类实现文件上传
Mar 27 Javascript
如何在vue 中引入使用jquery
Nov 10 jQuery
window.navigate 与 window.location.href 的使用区别介绍
Sep 21 #Javascript
javascript使用isNaN()函数判断变量是否为数字
Sep 21 #Javascript
js调用css属性写法
Sep 21 #Javascript
JSP跨iframe如何传递参数实现代码
Sep 21 #Javascript
使用Jquery实现点击文字后变成文本框且可修改
Sep 21 #Javascript
用JS做的简单的可折叠的两级树形菜单
Sep 21 #Javascript
javascript获得网页窗口实际大小的示例代码
Sep 21 #Javascript
You might like
IIS环境下快速安装、配置和调试PHP5.2.0
2006/12/17 PHP
php简单的留言板与回复功能具体实现
2014/02/19 PHP
JavaScript DOM 学习第五章 表单简介
2010/02/19 Javascript
JavaScript中String和StringBuffer的速度之争
2010/04/01 Javascript
Jquery判断IE6等浏览器的代码
2011/04/05 Javascript
AeroWindow 基于JQuery的弹出窗口插件
2011/06/27 Javascript
Jquery Post处理后不进入回调的原因及解决方法
2014/07/15 Javascript
Ajax中解析Json的两种方法对比分析
2015/06/25 Javascript
基于Jquery代码实现支持PC端手机端幻灯片代码
2015/11/17 Javascript
用v-html解决Vue.js渲染中html标签不被解析的问题
2016/12/14 Javascript
React组件的三种写法总结
2017/01/12 Javascript
vue todo-list组件发布到npm上的方法
2018/04/04 Javascript
vue项目中应用ueditor自定义上传按钮功能
2018/04/27 Javascript
js实现京东秒杀倒计时功能
2019/01/21 Javascript
JavaScript函数的4种调用方法实例分析
2019/03/05 Javascript
怎样在vue项目下添加ESLint的方法
2019/05/16 Javascript
对TypeScript库进行单元测试的方法
2019/07/18 Javascript
Python实现微信公众平台自定义菜单实例
2015/03/20 Python
python实现将汉字转换成汉语拼音的库
2015/05/05 Python
Python爬虫框架Scrapy实例代码
2018/03/04 Python
python查询mysql,返回json的实例
2018/03/26 Python
django 实现电子支付功能的示例代码
2018/07/25 Python
Python tkinter布局与按钮间距设置方式
2020/03/04 Python
在django中form的label和verbose name的区别说明
2020/05/20 Python
python--shutil移动文件到另一个路径的操作
2020/07/13 Python
戴尔荷兰官方网站:Dell荷兰
2020/10/04 全球购物
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
sort命令的作用和用法
2012/11/04 面试题
高分子材料与工程专业推荐信
2013/12/01 职场文书
三严三实民主生活会发言稿
2014/10/13 职场文书
中秋节主题班会
2015/08/14 职场文书
升学宴学生致辞
2015/09/29 职场文书
导游词之无锡梅园
2019/11/28 职场文书
MySql存储过程之逻辑判断和条件控制
2021/05/26 MySQL
Python办公自动化解决world文件批量转换
2021/09/15 Python
Python 一键获取电脑浏览器的账号密码
2022/05/11 Python