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)的更多相关文章

  1. Vue3语法快速入门以及写一个倒计时组件

    Vue3写一个倒计时组件 vue3 beta版本发布已有一段时间了,文档也大概看了一下,不过对于学一门技术,最好的方法还是实战,于是找了一个比较简单的组件用vue3来实现,参考的是vant的count ...

  2. 比较全的JavaScript倒计时脚本

    JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...

  3. jQuery倒计时组件(jquery.downCount.js)

    //html <span class="days">00</span> <span class="hours">00< ...

  4. JavaScript倒计时脚本

    JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...

  5. Vue回炉重造之封装防刷新考试倒计时组件

    <!-- 考试倒计时组件 --> <template> <div class="time"> <p>00:{{timerCount2 ...

  6. JavaScript倒计时

    倒计时: 1.设置一个有效的结束日期 2.计算剩余时间 3.将时间转换成可用的格式 4.输出时钟数据作为一个可重用的对象 5.在页面上显示时钟,并在它到达0时停止 <div id="c ...

  7. React Native之倒计时组件的实现(ios android)

    React Native之倒计时组件的实现(ios android) 一,需求分析 1,app需实现类似于淘宝的活动倒计时,并在倒计时结束时,活动也结束. 2,实现订单倒计时,并在倒计时结束时,订单关 ...

  8. 微信小程序倒计时组件开发

    今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段 ...

  9. Vue2.0进阶组件 短信倒计时组件

    原本我想隔个几天再发文章,刚好今天项目上线,环境有问题,导致只有干等,刚好要为公司打造一套属于公司自己的一系列功能组件,这个使命就交给我了,大家也一直叫我来点干货,说实话我只是一个湿货,肚子里干一点就 ...

随机推荐

  1. C++ Primer中文版(第5版)(顶级畅销书重磅升级全面采用最新 C++ 11标准)

    C++ Primer中文版(第5版)(顶级畅销书重磅升级全面采用最新 C++ 11标准) [美]Stanley B. Lippman( 斯坦利李普曼)  Josee Lajoie(约瑟拉乔伊 )  B ...

  2. springMVC乱码问题-转

    彻底解决Spring MVC 中文乱码 问题     1:表单提交controller获得中文参数后乱码解决方案 注意:  jsp页面编码设置为UTF-8 form表单提交方式为必须为post,get ...

  3. sqlserver自定义函数的创建与调用

    sqlserver中有系统提供的函数,像avg.sum.getdate()等,用户还可以自定义函数. 用户自定义的函数包括:标量函数和表值函数,其中标量函数和系统函数的用法一样,表值函数根据主体的定义 ...

  4. CAN Timing Sample Point

    typedef struct { //char name[ 16 ]; // Name of the CAN controller hardware //uint32_t ref_clk; // CA ...

  5. The main difference between Java & C++(转载)

    转载自:http://stackoverflow.com/questions/9192309/the-main-difference-between-java-c C++ supports point ...

  6. mybatis中传入String类型参数异常

    在使用mybatis时,写了一条sql语句,只有一个String类型的参数, 示例代码 <select id="getApplyNum" parameterType=&quo ...

  7. spring和ehcache整合,实现基于注解的缓存实现

    要实现基于注解的缓存实现,要求Spring的版本在3.1或以上版本. 首先需要在spring的配置文件中添加对缓存注解的实现: <?xml version="1.0" enc ...

  8. PHP多次调用Mysql存储过程报错解决办法

    PHP多次调用Mysql数据库的存储过程会出现问题,主要问题为存储过程中执行多次SQL语句不能一一释放导致的,网上找了一些解决办法,比如使用 multi_query 然后一个一个释放,但是发现根本不适 ...

  9. Android Studio如何引用外部Library工程

    参考:    http://stackoverflow.com/questions/16588064/how-do-i-add-a-library-project-to-the-android-stu ...

  10. 修改maven一更新jre就变成1.5版本

    <build> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> ...