使用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 相关文章推荐
JScript中的&quot;this&quot;关键字使用方式补充材料
Mar 08 Javascript
Flash+XML滚动新闻代码 无图片 附源码下载
Nov 22 Javascript
jquery图片上下tab切换效果
Mar 18 Javascript
js获取当前日期代码适用于网页头部
Jun 27 Javascript
JS实现随机数生成算法示例代码
Aug 08 Javascript
js匿名函数的调用示例(形式多种多样)
Aug 20 Javascript
js实现String.Fomat的实例代码
Sep 02 Javascript
jQuery控制元素隐藏和显示
Mar 03 Javascript
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
原生js实现淘宝放大镜效果
Oct 28 Javascript
js实现坦克移动小游戏
Oct 28 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
Nov 04 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
基于文本的留言簿
2006/10/09 PHP
PHP实现采集程序原理和简单示例代码
2007/03/18 PHP
PHP 替换模板变量实现步骤
2009/08/24 PHP
Yii2实现ajax上传图片插件用法
2016/04/28 PHP
用javascript获取地址栏参数
2006/12/22 Javascript
几个高效,简洁的字符处理函数
2007/04/12 Javascript
很棒的学习jQuery的12个网站推荐
2011/04/28 Javascript
jQuery登陆判断简单实现代码
2013/04/21 Javascript
JavaScript实现查找字符串中第一个不重复的字符
2014/12/29 Javascript
JQuery工具函数汇总
2015/06/15 Javascript
javascript实现的猜数小游戏完整实例代码
2016/05/10 Javascript
使用JavaScript获取URL中的参数(两种方法)
2016/11/16 Javascript
jQuery编写网页版2048小游戏
2017/01/06 Javascript
使用AngularJS 跨站请求如何解决jsonp请求问题
2017/01/16 Javascript
qrcode生成二维码微信长按无法识别问题的解决
2019/04/04 Javascript
原生JS实现留言板功能
2020/02/08 Javascript
Python实现的异步代理爬虫及代理池
2017/03/17 Python
tensorflow 使用flags定义命令行参数的方法
2018/04/23 Python
python Tcp协议发送和接收信息的例子
2019/07/22 Python
Python 程序员必须掌握的日志记录
2020/08/17 Python
CSS3实现可爱的小黄人动画
2016/07/11 HTML / CSS
详解canvas绘制网络字体几种方法
2019/08/27 HTML / CSS
西班牙灯具网上商店:Lampara.es
2018/06/05 全球购物
印度在线购物网站:Paytmmall
2019/07/24 全球购物
联想智利官方网站:Lenovo Chile
2020/06/03 全球购物
求职简历中的自我评价分享
2013/12/08 职场文书
优秀求职自荐信怎样写
2013/12/18 职场文书
旅游与酒店管理专业求职信
2014/07/21 职场文书
2015年大班保育员工作总结
2015/05/18 职场文书
追悼词范文大全
2015/06/23 职场文书
酒店温馨提示语
2015/07/14 职场文书
幼儿园科学课教学反思
2016/03/03 职场文书
pytorch model.cuda()花费时间很长的解决
2021/06/01 Python
Python实现学生管理系统并生成exe可执行文件详解流程
2022/01/22 Python
JavaWeb实现显示mysql数据库数据
2022/03/19 Java/Android
spring boot实现文件上传
2022/08/14 Java/Android