JavaScript实现倒计时跳转页面功能【实用】


Posted in Javascript onDecember 13, 2016

这里给大家提供一个好用的JS写的倒计时页面,就像一些网站上点提交后出现的倒计时页面类似。

页面代码简单,直接拷贝就能运行,页面可以自己美化下。

<!--这里定义倒计时开始数值-->
<span id="totalSecond">5</span>
<!--定义js变量及方法-->
<script language="javascript" type="text/javascript">
var second = document.getElementById('totalSecond').textContent;
if (navigator.appName.indexOf("Explorer") > -1)
{
second = document.getElementById('totalSecond').innerText; 
} else
{
second = document.getElementById('totalSecond').textContent; 
}
setInterval("redirect()", 1000); 
function redirect()
{
if (second < 0)
{
 <!--定义倒计时后跳转页面-->
location.href = 'default.aspx'; 
} else
{
if (navigator.appName.indexOf("Explorer") > -1)
{
document.getElementById('totalSecond').innerText = second--; 
} else
{
document.getElementById('totalSecond').textContent = second--; 
}
}
}
</script>

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

Javascript 相关文章推荐
ie 处理 gif动画 的onload 事件的一个 bug
Apr 12 Javascript
来自chinaz的ajax获取评论代码
May 03 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
May 05 Javascript
在JavaScript中对HTML进行反转义详解
May 18 Javascript
使用Ajax生成的Excel文件并下载的实例
Nov 21 Javascript
jQuery仿IOS弹出框插件
Feb 18 Javascript
Vue.js实战之利用vue-router实现跳转页面
Apr 01 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
May 02 Javascript
JavaScript设计模式之观察者模式实例详解
Jan 16 Javascript
Vue使用zTree插件封装树组件操作示例
Apr 25 Javascript
解决layui-table单元格设置为百分比在ie8下不能自适应的问题
Sep 28 Javascript
vue-next/runtime-core 源码阅读指南详解
Oct 25 Javascript
Javascript实现倒计时(防页面刷新)实例
Dec 13 #Javascript
利用select实现年月日三级联动的日期选择效果【推荐】
Dec 13 #Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
Dec 13 #Javascript
深入理解选择框脚本[推荐]
Dec 13 #Javascript
AngularJS使用ng-repeat和ng-if实现数据的删选显示效果示例【适用于表单数据的显示】
Dec 13 #Javascript
Bootstrap modal使用及点击外部不消失的解决方法
Dec 13 #Javascript
jQuery 获取select选中值及清除选中状态
Dec 13 #Javascript
You might like
如何阻止网站被恶意反向代理访问(防网站镜像)
2014/03/18 PHP
解决CodeIgniter伪静态失效
2014/06/09 PHP
PHP实现双链表删除与插入节点的方法示例
2017/11/11 PHP
jQuery给动态添加的元素绑定事件的方法
2015/03/09 Javascript
JS模仿手机端九宫格登录功能实现代码
2016/04/28 Javascript
Bootstrap选项卡动态切换效果
2016/11/28 Javascript
js实现倒计时效果(小于10补零)
2017/03/08 Javascript
JavaScript简单拖拽效果(1)
2017/05/17 Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
2017/05/22 Javascript
JS实现按钮控制计时开始和停止功能
2017/07/27 Javascript
详谈表单重复提交的三种情况及解决方法
2017/08/16 Javascript
javascript 中模板方法单例的实现方法
2017/10/17 Javascript
使用classList来实现两个按钮样式的切换方法
2018/01/24 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
利用Vue-draggable组件实现Vue项目中表格内容的拖拽排序
2019/06/07 Javascript
ES6小技巧之代替lodash
2019/06/07 Javascript
基于Layui自定义模块的使用方法详解
2019/09/14 Javascript
JavaScript实现瀑布流布局的3种方式
2020/12/27 Javascript
wxpython 学习笔记 第一天
2009/03/16 Python
python多进程共享变量
2016/04/06 Python
python中类变量与成员变量的使用注意点总结
2017/04/29 Python
解决安装pycharm后不能执行python脚本的问题
2019/01/19 Python
python 简单的调用有道翻译
2020/11/25 Python
python元组拆包实现方法
2021/02/28 Python
高清屏下canvas重置尺寸引发的问题的解决
2019/10/14 HTML / CSS
介绍下java.util.Arrays类
2012/10/16 面试题
小学敬老月活动方案
2014/02/11 职场文书
2014年公务员思想汇报范文:全心全意为人民服务
2014/03/06 职场文书
自主招生学校推荐信
2014/09/26 职场文书
2014年班级工作总结范文
2014/12/23 职场文书
2016春节家属慰问信
2015/03/25 职场文书
2015年党员岗位承诺书
2015/04/27 职场文书
招商银行工作证明
2015/06/17 职场文书
Netty结合Protobuf进行编解码的方法
2021/06/26 Java/Android
Python正则表达式中flags参数的实例详解
2022/04/01 Python
Oracle查看表空间使用率以及爆满解决方案详解
2022/07/23 Oracle