博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
倒计时组件
阅读量:6212 次
发布时间:2019-06-21

本文共 1670 字,大约阅读时间需要 5 分钟。

倒计时组件:

function Countdown(leavetime) {        this._init(leavetime);    }  Countdown.prototype = {      _init : function (leavetime) {          this.timer = null;          this.leavetime = leavetime || 0;          this.clock = {};          this.clock.leavetimeSec = Math.floor(this.leavetime / 1000);      },      _format : function () {          this.clock.sec = this.clock.leavetimeSec % 3600 % 60;          this.clock.min = Math.floor(this.clock.leavetimeSec % 3600 / 60);          this.clock.hours = Math.floor(this.clock.leavetimeSec / 3600);          this.clock.secStr = String(this.clock.sec).length == 1 ? ('0' + this.clock.sec) : String(this.clock.sec);          this.clock.minStr = String(this.clock.min).length == 1 ? ('0' + this.clock.min) : String(this.clock.min);          this.clock.hourStr = String(this.clock.hours).length == 1 ? ('0' + this.clock.hours) : String(this.clock.hours);      },      run : function (doFn, endFn) {          var that = this;          this._format();          doFn(this.clock);          if (this.clock.leavetimeSec == 0) {              clearTimeout(this.timer);              endFn(this.clock);              return this;          }          this.clock.leavetimeSec --;          this.timer = setTimeout(function () {              that.run(doFn, endFn);          }, 1000)      }  };

 

使用:(为说明使用,运用了jquery获取dom对象)

html: 
var Countdown = new Countdown(30000000); // 实例化倒计时// 运行倒计时Countdown.run(function (clock) { // clock 是个对象 挂载着小时 分钟 秒钟 $('#box').text(clock.hourStr + ':' + clock.minStr + ':' + clock.secStr); }, function () { // 这里写倒计时到点的callback alert('结束了!') });

 

  

转载于:https://www.cnblogs.com/bsj2016/p/6647227.html

你可能感兴趣的文章
神经网络和深度学习-第二周神经网络基础-第二节:Logistic回归
查看>>
Myeclipse代码提示及如何设置自动提示
查看>>
Linux学习---Day04
查看>>
Git使用详细教程
查看>>
MyEclipse+Tomcat+MAVEN+SVN项目完整环境搭建
查看>>
json&pickle序列化
查看>>
月PV破15亿:Tumblr架构揭密
查看>>
Nginx配置404页面
查看>>
extjs正则表达式验证
查看>>
教你构建MySQL主从结构,实现基于SSL加密的主从同步机制。
查看>>
KIS标准系列“无效的加密服务器或加密服务器未启动”问题
查看>>
Android Studio 打包
查看>>
ubuntu 安装部署rsh
查看>>
ubuntu上搭建svn+apache服务器
查看>>
LaTeX数学公式
查看>>
我的友情链接
查看>>
Gitlab邮件配置
查看>>
shell-sed
查看>>
cacti_nagios<at>centos(redhat)整合安装简要记录
查看>>
WPF 后台触发 Validate UI‘s Element
查看>>