HTML页面定时跳转方法解析(2种任选)


Posted in Javascript onDecember 22, 2016

有 2 种方法可以实现 html 的定时页面跳转,1、meta refresh 实现。2、JavaScript 实现。

1、通过 meta refresh 实现 3 秒后自动跳转到 http://www.cnblogs.com/wuxibolgs329/ 页面。

<!doctype html>
 <html>
 <head>



<meta charset="utf-8">



<title>前端笔记</title>



<meta http-equiv="refresh" content="3;url=http://www.cnblogs.com/wuxibolgs329/">


</head>

<body>

</body>
</html>

2、通过 JavaScript 实现 8 秒后自动跳转到 http://www.cnblogs.com/wuxibolgs329/  页面。

<!doctype html>
<html>


<head>



<meta charset="utf-8">



<title>前端笔记</title>



<script type="text/javascript">




var time = 8; //时间,秒




function Redirect() {
 



window.location = "http://www.cssue.com/";




}




var i = 0;




function dis() {
 



document.all.s.innerHTML = "还剩" + (time - i) + "秒";
 



i++;




}




timer = setInterval('dis()', 1000); //显示时间




timer = setTimeout('Redirect()', time * 1000); //跳转



</script>

</head>

<body>


<span id="s"></span>

</body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
Javascript 继承机制实例
Aug 12 Javascript
基于jQuery的图片剪切插件
Aug 03 Javascript
document.all的一个比较完整的总结及案例
Jan 31 Javascript
jQuery中filter()和find()的区别深入了解
Sep 25 Javascript
删除javascript所创建子节点的方法
May 21 Javascript
javascript先序遍历DOM树的方法
Feb 27 Javascript
限制只能输入数字的实现代码
May 16 Javascript
JavaScript中解决多浏览器兼容性23个问题的快速解决方法
May 19 Javascript
Angular2  NgModule 模块详解
Oct 19 Javascript
详解打造 Vue.js 可复用组件
Mar 24 Javascript
Angularjs自定义指令Directive详解
May 27 Javascript
ES6小技巧之代替lodash
Jun 07 Javascript
vue双向绑定的简单实现
Dec 22 #Javascript
jQuery使用Layer弹出层插件闪退问题
Dec 22 #Javascript
深入理解jquery中extend的实现
Dec 22 #Javascript
jQuery插件DataTable使用方法详解(.Net平台)
Dec 22 #Javascript
JS实现间歇滚动的运动效果实例
Dec 22 #Javascript
javascript-解决mongoose数据查询的异步操作
Dec 22 #Javascript
Bootstrap popover用法详解
Dec 22 #Javascript
You might like
Codeigniter实现处理用户登录验证后的URL跳转
2014/06/12 PHP
php正则表达式学习笔记
2015/11/13 PHP
ThinkPHP5.1+Ajax实现的无刷新分页功能示例
2020/02/10 PHP
php模拟post提交请求调用接口示例解析
2020/08/07 PHP
JavaScript中void(0)的具体含义解释
2007/02/27 Javascript
Jquery实战_读书笔记2 选择器
2010/01/22 Javascript
JavaScript中数组对象的那些自带方法介绍
2013/03/12 Javascript
jquery实现滑动图片自己测试的例子
2013/11/05 Javascript
node.js中的dns.getServers方法使用说明
2014/12/08 Javascript
javascript实现仿IE顶部的可关闭警告条
2015/05/05 Javascript
实现placeholder效果的方案汇总
2015/06/11 Javascript
JavaScript File分段上传
2016/03/10 Javascript
JQuery的Pager分页器实现代码
2016/05/03 Javascript
JS数字千分位格式化实现方法总结
2016/12/16 Javascript
bootstrapValidator.min.js表单验证插件
2017/02/09 Javascript
vue-router实现tab标签页(单页面)详解
2017/10/17 Javascript
webpack4 CSS Tree Shaking的使用
2018/09/03 Javascript
Vue中插入HTML代码的方法
2018/09/21 Javascript
iview同时验证多个表单问题总结
2018/09/29 Javascript
vue.js多页面开发环境搭建过程
2019/04/24 Javascript
TypeScript类型声明书写详解
2019/08/28 Javascript
layui table 表格上添加日期控件的两种方法
2019/09/28 Javascript
JS函数参数的传递与同名参数实例分析
2020/03/16 Javascript
Js数组扁平化实现方法代码总汇
2020/11/11 Javascript
ant design的table组件实现全选功能以及自定义分页
2020/11/17 Javascript
[02:54]DOTA2英雄基础教程 撼地者
2014/01/14 DOTA
Python语言技巧之三元运算符使用介绍
2013/03/04 Python
python负载均衡的简单实现方法
2018/02/04 Python
python list删除元素时要注意的坑点分享
2018/04/18 Python
解决python 文本过滤和清理问题
2019/08/28 Python
OpenCV模板匹配matchTemplate的实现
2019/10/18 Python
利用pytorch实现对CIFAR-10数据集的分类
2020/01/14 Python
浅谈Python线程的同步互斥与死锁
2020/03/22 Python
html5 Canvas画图教程(8)—canvas里画曲线之bezierCurveTo方法
2013/01/09 HTML / CSS
巾帼建功标兵事迹材料
2014/05/11 职场文书
MySQL分布式恢复进阶
2022/07/23 MySQL