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 相关文章推荐
静态的动态续篇之来点XML
Aug 15 Javascript
使用jquery与图片美化checkbox和radio控件的代码(打包下载)
Nov 11 Javascript
jQuery添加和删除输入文本框标签代码
May 20 Javascript
jQuery的Each比JS原生for循环性能慢很多的原因
Jul 05 Javascript
BootstrapTable+KnockoutJS自定义T4模板快速生成增删改查页面
Aug 01 Javascript
vue的props实现子组件随父组件一起变化
Oct 27 Javascript
Canvas + JavaScript 制作图片粒子效果
Feb 08 Javascript
bootstrap实现动态进度条效果
Mar 08 Javascript
js 客户端打印html 并且去掉页眉、页脚的实例
Nov 03 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
微信小程序之侧边栏滑动实现过程解析(附完整源码)
Aug 23 Javascript
javascript合并两个数组最简单的实现方法
Sep 14 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
PHP 遍历XP文件夹下所有文件
2008/11/27 PHP
PHP安全技术之 实现php基本安全
2010/09/04 PHP
Yii2实现跨mysql数据库关联查询排序功能代码
2017/02/10 PHP
PHP const定义常量及global定义全局常量实例解析
2020/05/28 PHP
将HTML自动转为JS代码
2006/06/26 Javascript
一个可绑定数据源的jQuery数据表格插件
2010/07/17 Javascript
JS构建页面的DOM节点结构的实现代码
2011/12/09 Javascript
EasyUI的treegrid组件动态加载数据问题的解决办法
2011/12/11 Javascript
javascript遍历控件实例详细解析
2014/01/10 Javascript
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
2014/08/30 Javascript
javascript修改图片src的方法
2015/01/27 Javascript
Jquery的基本对象转换和文档加载用法实例
2015/02/25 Javascript
jQuery常用且重要方法汇总
2015/07/13 Javascript
JS实现双击屏幕滚动效果代码
2015/10/28 Javascript
50 个 jQuery 插件可将你的网站带到另外一个高度
2016/04/26 Javascript
Bootstrap表单制作代码
2017/03/17 Javascript
AngularJS实现的省市二级联动功能示例【可对选项实现增删】
2017/10/26 Javascript
vue+jquery+lodash实现滑动时顶部悬浮固定效果
2018/04/28 jQuery
vue-cli3项目展示本地Markdown文件的方法
2019/06/07 Javascript
vue+elementUI 复杂表单的验证、数据提交方案问题
2019/06/24 Javascript
python中正则表达式的使用详解
2014/10/17 Python
Python访问MySQL封装的常用类实例
2014/11/11 Python
python Django模板的使用方法
2016/01/14 Python
python 将数据保存为excel的xls格式(实例讲解)
2018/05/03 Python
python opencv旋转图像(保持图像不被裁减)
2018/07/26 Python
Python导入模块包原理及相关注意事项
2020/03/25 Python
python代码实现将列表中重复元素之间的内容全部滤除
2020/05/22 Python
html5页面结构_动力节点Java学院整理
2017/07/10 HTML / CSS
Finishline官网:美国一家领先的运动品牌鞋类、服装零售商
2016/07/20 全球购物
阿迪达斯俄罗斯官方商城:adidas俄罗斯
2017/03/08 全球购物
do you have any Best Practice for testing
2016/06/04 面试题
咖啡店的创业计划书,让你hold不住
2014/01/03 职场文书
红头文件任命书范本
2014/06/05 职场文书
四风查摆问题自查报告
2014/10/10 职场文书
高校群众路线教育实践活动剖析材料
2014/10/10 职场文书
竞聘演讲报告:基本写作有哪些?附开头范文
2019/10/16 职场文书