使用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 相关文章推荐
js取滚动条的尺寸的函数代码
Nov 30 Javascript
js中indexof的用法详细解析
Dec 24 Javascript
javascript创建动态表单的方法
Jul 25 Javascript
微信小程序 免费SSL证书https、TLS版本问题的解决办法
Dec 14 Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
Dec 27 Javascript
angular 基于ng-messages的表单验证实例
May 04 Javascript
基于Cookie常用操作以及属性介绍
Sep 07 Javascript
React + webpack 环境配置的方法步骤
Sep 07 Javascript
React Native 自定义下拉刷新上拉加载的列表的示例
Mar 01 Javascript
微信小程序实现bindtap等事件传参
Apr 08 Javascript
基于ts的动态接口数据配置的详解
Dec 18 Javascript
vue分页插件的使用方法
Dec 25 Javascript
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
PHP setTime 设置当前时间的代码
2012/08/27 PHP
深入理解PHP的远程多会话调试
2017/09/21 PHP
转一个日期输入控件,支持FF
2007/04/27 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
2011/09/05 Javascript
JQuery报错Uncaught TypeError: Illegal invocation的处理方法
2015/03/13 Javascript
angularjs客户端实现压缩图片文件并上传实例
2015/07/06 Javascript
js实现三张图(文)片一起切换的banner焦点图
2015/08/25 Javascript
jQuery实现响应鼠标滚动的动感菜单效果
2015/09/21 Javascript
JS实现点击按钮获取页面高度的方法
2015/11/02 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
详解a标签添加onclick事件的几种方式
2019/03/29 Javascript
javascript执行上下文、变量对象实例分析
2020/04/25 Javascript
js观察者模式的弹幕案例
2020/11/23 Javascript
在Python中使用判断语句和循环的教程
2015/04/25 Python
python清除指定目录内所有文件中script的方法
2015/06/30 Python
SQLite3中文编码 Python的实现
2017/01/11 Python
Python遍历文件夹和读写文件的实现方法
2017/05/10 Python
python交互式图形编程实例(一)
2017/11/17 Python
浅谈python日志的配置文件路径问题
2018/04/28 Python
python+PyQT实现系统桌面时钟
2020/06/16 Python
python检测IP地址变化并触发事件
2018/12/26 Python
Python使用post及get方式提交数据的实例
2019/01/24 Python
详解Python下载图片并保存本地的两种方式
2019/05/15 Python
洲际酒店集团大中华区:IHG中国
2016/08/17 全球购物
领先的钻石和订婚戒指零售商:Diamonds-USA
2016/12/11 全球购物
Zalando Lounge瑞士:时尚与生活方式购物俱乐部
2020/03/12 全球购物
包装类的功能、种类、常用方法
2012/01/27 面试题
什么时候用assert
2015/05/08 面试题
Java基础类库面试题
2013/09/04 面试题
生产内勤岗位职责
2013/12/07 职场文书
军校大学生个人的自我评价
2014/02/17 职场文书
优秀教师自我评价范文
2014/09/27 职场文书
教师思想作风整顿个人剖析材料
2014/10/10 职场文书
教师听课评语大全
2014/12/31 职场文书
安全主题班会教案
2015/08/12 职场文书
JavaScript圣杯布局与双飞翼布局实现案例详解
2022/08/05 Javascript