Javascript倒计时组件new TimeSpan(hours, minutes, minutes)
function TimeSpan(h, m, s) {
this.h = Number(h);
this.m = Number(m);
this.s = Number(s);
}
TimeSpan.prototype = {
timer: null,
stop: function() {
},
callback: Function(),
start: function(callback) {
var self = this;
if (callback) {
this.callback = callback;
}
if (isNaN(this.s)) {
return;
}
self.timer = setInterval(function() {
self.s--;
if (self.s >= 0) {
self.callback();
return;
}
//s < 0, m > 0
if (self.m > 0) {
self.s = 59;
self.m--;
self.callback();
return;
}
//s < 0 ,m = 0, h<1
if (isNaN(self.h) || self.h < 1) {
//self.callback();
clearInterval(self.timer);
return;
}
self.m = 59;
self.s = 59;
self.h--
self.callback();
}, 1000);
}
};
调用:
var ts = new TimeSpan(hours, minutes, minutes);
ts.start(function(){
var s = this.s < 10 ? "0" + this.s : this.s;
var m = this.m < 10 ? "0" + this.m : this.m;
$(".clock .time").html(m + "分" + s + "秒");
});
Javascript倒计时组件new TimeSpan(hours, minutes, minutes)的更多相关文章
- Vue3语法快速入门以及写一个倒计时组件
Vue3写一个倒计时组件 vue3 beta版本发布已有一段时间了,文档也大概看了一下,不过对于学一门技术,最好的方法还是实战,于是找了一个比较简单的组件用vue3来实现,参考的是vant的count ...
- 比较全的JavaScript倒计时脚本
JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...
- jQuery倒计时组件(jquery.downCount.js)
//html <span class="days">00</span> <span class="hours">00< ...
- JavaScript倒计时脚本
JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...
- Vue回炉重造之封装防刷新考试倒计时组件
<!-- 考试倒计时组件 --> <template> <div class="time"> <p>00:{{timerCount2 ...
- JavaScript倒计时
倒计时: 1.设置一个有效的结束日期 2.计算剩余时间 3.将时间转换成可用的格式 4.输出时钟数据作为一个可重用的对象 5.在页面上显示时钟,并在它到达0时停止 <div id="c ...
- React Native之倒计时组件的实现(ios android)
React Native之倒计时组件的实现(ios android) 一,需求分析 1,app需实现类似于淘宝的活动倒计时,并在倒计时结束时,活动也结束. 2,实现订单倒计时,并在倒计时结束时,订单关 ...
- 微信小程序倒计时组件开发
今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段 ...
- Vue2.0进阶组件 短信倒计时组件
原本我想隔个几天再发文章,刚好今天项目上线,环境有问题,导致只有干等,刚好要为公司打造一套属于公司自己的一系列功能组件,这个使命就交给我了,大家也一直叫我来点干货,说实话我只是一个湿货,肚子里干一点就 ...
随机推荐
- 每天一个linux命令(7):mv命令
mv命令是move的缩写,可以用来移动文件或者将文件改名(move (rename) files),是Linux系统下常用的命令,经常用来备份文件或者目录. 企业中常用的 [root@ local]# ...
- oracle--创建表空间、用户名、密码
原文链接:http://blog.sina.com.cn/s/blog_4ce992f40101cspr.html
- 通过ReadWriteReentrantLock源代码分析AbstractQueuedSynchronizer共享模式
1.特点 ReentrantLock能够实现共享资源的互斥访问,但是它在某些条件下效率比较低下.比如,多个线程要查询(或者说读取)某列车的余票数,如果使用ReentrantLock,那么多个线程的查询 ...
- FindFriendsServer服务搭建
本文介绍如何搭建FindFriendsServer(https://github.com/hnrainll/FindFriendsServer)所需的环境. 环境需要: Windows+Apache+ ...
- jQuery 之父:每天写代码
去年秋天我的支线代码项目 遇到了一些问题,项目进展不足,而且我没法找到一个完成更多代码的方法(在不影响我在Khan Academy方面的工作的前提下). 我主要在周末进行我的支线,当然有时候也在晚上进 ...
- android: 使用 IntentService
9.5.2 使用 IntentService 话说回来,在本章一开始的时候我们就已经知道,服务中的代码都是默认运行在主线程 当中的,如果直接在服务里去处理一些耗时的逻辑,就很容易出现 ANR(Appl ...
- 关于《精通移动App测试实战:技术、工具和案例》图书勘误信息
首先,对由于我们工作的疏忽向<精通移动App测试实战:技术.工具和案例>读者朋友们表示歉意,同时已将这些问题反馈给了出版社编辑同志,再版时将会统一修正: 其次,勘误信息请参看附件pdf文档 ...
- EnumHelper枚举常用操作类
在项目中需要把枚举填充到下拉框中,所以使用统一的方法实现,测试代码如下: namespace CutPictureTest.Comm { public class EnumHelper { publi ...
- 安装redis监控
在修改登录中心的时候,数据存储在redis里面,需要对redis进行监控,使用的是Redis-Live 参考文章: http://www.nkrode.com/article/real-time-da ...
- 有时候为了方便sql语句的对比和查询,我们可以使用declare来定义变量 上下篇的问题
--定义一些参数 declare @nodeId int,@ekid int ,@ecid int,@eid int,@pid int --列表 SELECT * FROM ( SELECT *,RO ...