jquery.countdown 倒计时插件的学习
1.第一种简单的使用 第一个时间是你的倒计时截止时间,finalDate格式可以是YYYY/MM/DD MM/DD/YYYY
YYYY/MM/DD hh:mm:ss MM/DD/YYYY hh:mm:ss 具体格式可以查一下官方文档,第二个参数是回调函数
$(div#clock).countdown(finalDate[, callback]);
eg:这个是我项目中的部分源码 function timePast(data,divId){
// divId是我外界穿过来的id
$(# + divId).countdown(data, function(event) {
var $this = $(this).html(event.strftime(
+ <span>%M</span> 分
+ <span>%S</span> 秒));
if (event.type == finish){
//倒计时完成
}
});
} 1.第一种简单的使用 第一个时间是你的倒计时截止时间,finalDate格式可以是YYYY/MM/DD MM/DD/YYYY YYYY/MM/DD hh:mm:ss MM/DD/YYYY hh:mm:ss 具体格式可以查一下官方文档,第二个参数是回调函数 $(div#clock).countdown(finalDate[, callback]); eg:这个是我项目中的部分源码 function timePast(data,divId){ // divId是我外界穿过来的id $(# + divId).countdown(data, function(event) { var $this = $(this).html(event.strftime( +
%M 分 +
%S 秒)); if (event.type == finish){ //倒计时完成 } }); }
2.第二种简单的使用 第一个时间是你的倒计时截止事件,第二个参数是倒计时正在进行回调函数,你在这里面可以进行倒计时的显示处理
第三个参数是你倒计时完成时的回调函数
eg: function timePast(data,divId){
$(# + divId).countdown(data)
.on(update.countdown, function () {
var $this = $(this).html(event.strftime(
+ <span>%M</span> 分
+ <span>%S</span> 秒));
})
.on(finish.countdown, function () {
//倒计时完成
});
}
3.第三种使用 第一个参数不解释大家都懂的,第二参数传一个对象,里面是一些配置参数 elapse参数是bool值,当倒计时完成是否继续,
precison是更新的间隔时间单位毫秒, defer 翻译过来是定义初始化模式,具体还不清楚怎么使用,这个研究后稍后会更新,后面可以
像上面的方法以一样.on链式执行其他方法
$(div#clock).countdown(finalDate, {
elapse: {bool} Allow to continue after finishes,
precision: {int} The update rate in milliseconds,
defer: {bool} Deferred initialization mode
})
格式化时间:
使用event.strftime为格式化时间,它根据给定的格式字符串中的指令来格式化偏移日期。它的格式是使用%符号来分隔参数,任何不带%符号的字符串将被原样输出。
API文档:http://hilios.github.io/jQuery.countdown/documentation.html
jQuery.countdown倒计时插件的github地址为:
jQuery.countdown倒计时插件的github地址为: