各种页面定时跳转(倒计时跳转)代码总结


Posted in Javascript onOctober 24, 2013

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

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

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

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

(3)稍微复杂点,多见于登陆之后的定时跳转
<!doctype html> 
<head> 
<meta charset=utf-8" /> 
<title>js定时跳转页面的方法</title> 
</head> 
<body> 
<script> 
var t=10;//设定跳转的时间 
setInterval("refer()",1000); //启动1秒定时 
function refer(){ 
if(t==0){ 
location="http://www.baidu.com"; //#设定跳转的链接地址 
} 
document.getElementById('show').innerHTML=""+t+"秒后跳转到百度"; // 显示倒计时 
t--; // 计数器递减 
//本文转自: 
} 
</script> 
<span id="show"></span> 
</body> 
</html>
Javascript 相关文章推荐
学习从实践开始之jQuery插件开发 对话框插件开发
Apr 26 Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
Oct 17 Javascript
jQuery实现表单提交时判断的方法
Dec 13 Javascript
js上传图片及预览功能实例分析
Apr 24 Javascript
JavaScript数据结构学习之数组、栈与队列
May 02 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
Dec 06 Javascript
vue中$set的使用(结合在实际应用中遇到的坑)
Jul 10 Javascript
node.js到底要不要加分号浅析
Jul 11 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
Sep 07 Javascript
ES6使用export和import实现模块化的方法
Sep 10 Javascript
详解js删除数组中的指定元素
Oct 31 Javascript
Mpvue中使用Vant Weapp组件库的方法步骤
May 16 Javascript
js 浏览本地文件夹系统示例代码
Oct 24 #Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
Oct 24 #Javascript
Flexigrid在IE下不显示数据的处理的解决方法
Oct 24 #Javascript
js获取事件源及触发该事件的对象
Oct 24 #Javascript
jquery数据验证插件(自制,简单,练手)实例代码
Oct 24 #Javascript
浏览器兼容console对象的简要解决方案分享
Oct 24 #Javascript
js设置cookie过期及清除浏览器对应名称的cookie
Oct 24 #Javascript
You might like
Yii2.0中的COOKIE和SESSION用法
2016/08/12 PHP
laravel5实现微信第三方登录功能
2018/12/06 PHP
JS循环遍历JSON数据的方法
2014/07/08 Javascript
JS表格组件神器bootstrap table详解(基础版)
2015/12/08 Javascript
nodejs 中模拟实现 emmiter 自定义事件
2016/02/22 NodeJs
JavaScript提升性能的常用技巧总结【经典】
2016/06/20 Javascript
JavaScript重定向URL参数的两种方法小结
2016/10/19 Javascript
Javascript的动态增加类的实现方法
2016/10/20 Javascript
详解Vue.js动态绑定class
2016/12/20 Javascript
解决BootStrap Fileinput手机图片上传显示旋转问题
2017/06/01 Javascript
JavaScript 程序错误Cannot use 'in' operator to search的解决方法
2017/07/10 Javascript
JS运动特效之链式运动分析
2018/01/24 Javascript
js核心基础之闭包的应用实例分析
2019/05/11 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
2019/10/12 jQuery
微信小程序批量上传图片到七牛(推荐)
2019/12/19 Javascript
Python中字符串的常见操作技巧总结
2016/07/28 Python
python 文件操作api(文件操作函数)
2016/08/28 Python
代码讲解Python对Windows服务进行监控
2018/02/11 Python
Python中的Numpy矩阵操作
2018/08/12 Python
Python3爬虫学习之MySQL数据库存储爬取的信息详解
2018/12/12 Python
django框架基于模板 生成 excel(xls) 文件操作示例
2019/06/19 Python
Python基础之列表常见操作经典实例详解
2020/02/26 Python
俄罗斯香水和化妆品在线商店:Aroma-butik
2020/02/28 全球购物
NFL官方在线商店:NFLShop
2020/07/29 全球购物
高中生自我评价个人范文
2013/11/09 职场文书
质检部职责
2013/12/28 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
企业军训感言
2014/02/08 职场文书
电子信息专业应届生自荐信
2014/06/04 职场文书
中学生社会实践活动总结
2014/07/03 职场文书
杭白菊导游词
2015/02/10 职场文书
2015年学生会干事工作总结
2015/04/09 职场文书
对学校的意见和建议
2015/06/04 职场文书
选择比努力更重要?这是长期以来对“努力”的最大误解
2019/07/12 职场文书
2019职场单身人才调研报告:互联网行业单身比例最高
2019/08/07 职场文书
windows server2012 R2下安装PaddleOCR服务的的详细步骤
2022/09/23 Servers