1.使用：
$('#clock').countdown(finalData[, callback(或options)]);
finalData - 必选
options - 可选
2.参数：
1>finalData - 设置倒计时的终止时间
3种格式：
1)原生的 'Date' 对象
2)毫秒格式的 '时间戳'(javascript的时间戳，单位是 '毫秒'，切记！)
matchers.push(/^[0-9]*$/.source);
源码中的正则：
matchers.push(/^[0-9]*$/.source);
3)字符串格式的时间
YYYY/MM/DD
MM/DD/YYYY
YYYY/MM/DD hh:mm:ss
MM/DD/YYYY hh:mm:ss
源码中的正则：
matchers.push(/([0-9]{1,2}\/){2}[0-9]{4}( [0-9]{1,2}(:[0-9]{2}){2})?/.source);
matchers.push(/[0-9]{4}([\/\-][0-9]{1,2}){2}( [0-9]{1,2}(:[0-9]{2}){2})?/.source);
2>callback(或options) - 回调函数 或者 options 对象
1)callback - 倒计时，有3个事件类型，都绑定上回调方法！
function(event) {}
源码分析：
this.$el.on("update.countdown", options);
this.$el.on("stoped.countdown", options);
this.$el.on("finish.countdown", options);
2)options - 传递一个对象，覆盖 'countdown' 的默认配置，默认配置有3个：
defaultOptions = {
precision: 100, // int - 更新速率(毫秒为单位)
elapse: false, // bool - 倒计时结束后，是否继续
defer: false // bool - 延迟初始化模式
}
1.precision - 倒计时的精度
源码分析：
this.interval = setInterval(function() {
self.update.call(self);
}, this.options.precision); // setInterval()的第二个参数
2.elapse - 过期模式
false - 一旦到达设定的最终时间，停止计时。(默认)
true - 到达最终时间，继续执行倒计时。
源码分析：
if (!this.options.elapse &&this.totalSecsLeft === 0) { // 到达最终事件
this.stop(); // 停止计时
this.dispatchEvent("finish"); // 分发 'finish' 事件
} else {
this.dispatchEvent("update"); // 分发 'update' 事件
}
--------
一旦到达终止时间，会传递给事件对象，一个属性：
event.elapsed - 是否已经过期
this.elapsed = now >= this.finalDate;
3.defer - 是否延迟启动
false - 表示初始化了 '倒计时对象'，会自动开始计时。(默认)
true - 在实例化对象后，需要我们来手动启动计时。
源码分析：
if (this.options.defer === false) {
this.start();
}
3.事件：
3个事件方法：
update.countdown
finish.countdown
stoped.countdown // 这个得说明下，文档中，应该是错误的！源码中是：'stoped'，文档中写的是 'stop'
3个事件，都有一个 'namespace-命名空间'，'.countdown'
每个事件对象，具备额外的公共属性：
event.finalDate = this.finalDate; // 设定的终止时间
event.elapsed = this.elapsed; // 是否已经过期
event.offset = $.extend({}, this.offset); // 当前时间，在各个时间刻度上的计算
源码分析：
this.offset = {
seconds: this.totalSecsLeft % 60,
minutes: Math.floor(this.totalSecsLeft / 60) % 60,
hours: Math.floor(this.totalSecsLeft / 60 / 60) % 24,
days: Math.floor(this.totalSecsLeft / 60 / 60 / 24) % 7,
daysToWeek: Math.floor(this.totalSecsLeft / 60 / 60 / 24) % 7,
daysToMonth: Math.floor(this.totalSecsLeft / 60 / 60 / 24 % 30.4368),
weeks: Math.floor(this.totalSecsLeft / 60 / 60 / 24 / 7),
weeksToMonth: Math.floor(this.totalSecsLeft / 60 / 60 / 24 / 7) % 4,
months: Math.floor(this.totalSecsLeft / 60 / 60 / 24 / 30.4368),
years: Math.abs(this.finalDate.getFullYear() - now.getFullYear()),
totalDays: Math.floor(this.totalSecsLeft / 60 / 60 / 24),
totalHours: Math.floor(this.totalSecsLeft / 60 / 60),
totalMinutes: Math.floor(this.totalSecsLeft / 60),
totalSeconds: this.totalSecsLeft
};
event.strftime = strftime(this.offset); // 格式化时间函数
源码分析：
function strftime(offsetObject) {
return function(format) {
/*
匹配指令：
%-字母
%!字母
%字母
%字母:其它字符;
*/
vardirectives = format.match(/%(-|!)?[A-Z]{1}(:[^;]+;)?/gi);
if (directives) {
// 对匹配到的每个指令，进行解析
for (vari = 0, len = directives.length; i < len; ++i) {
vardirective = directives[i].match(/%(-|!)?([a-zA-Z]{1})(:[^;]+;)?/),
regexp = escapedRegExp(directive[0]), // 正则
modifier = directive[1] || "", // 模式：- | ! | ""
plural = directive[3] || "", // :其他字符; ------ 和 '!' 模式一起使用
value = null;
directive = directive[2]; // 表示时间刻度的字母(Y,m,n,d,w...)
// 匹配到了该字母对应的时间值，进行字符替换
if (DIRECTIVE_KEY_MAP.hasOwnProperty(directive)) {
value = DIRECTIVE_KEY_MAP[directive];
value = Number(offsetObject[value]);
}
if (value !== null) {
// '!'模式，执行 'pluralize'，会需要 '(:[^;]+;)' 匹配到的值
if (modifier === "!") {
value = pluralize(plural, value);
}
// ""模式，小于10，填充 '0'
if (modifier === "") {
if (value< 10) {
value = "0" + value.toString();
}
}
format = format.replace(regexp, value.toString());
}
}
}
format = format.replace(/%%/, "%");
return format;
};
}
// '!' 模式时，提供对复数的多元化支持，默认复数会添加 's'，我们可使用自定义的后缀 '...'
function pluralize(format, count) {
varplural = "s", singular = "";
if (format) {
// 去除:, ; , '空白'。使用 ',' 分隔单数和复数的2种格式
format = format.replace(/(:|;|\s)/gi, "").split(/\,/);
if (format.length === 1) {
plural = format[0];
} else {
singular = format[0];
plural = format[1];
}
}
// 当时间刻度> 1，返回复数格式，否则为单数
if (Math.abs(count)> 1) {
return plural;
} else {
return singular;
}
}
4.event.strftime - 格式化函数，是一个简单的格式化程序，有助于保持代码更加语义，并且避免重复的工作。
它根据给定格式字符串中的指令来格式化偏移日期。 该指令由百分比（％）组成。 未列为指令的任何文本将被传递到输出字符串。
event.strftime(%W weeks %-d days %-H h %M min %S sec');
/*
Y: "years",
m: "months",
n: "daysToMonth",
d: "daysToWeek",
w: "weeks",
W: "weeksToMonth",
H: "hours",
M: "minutes",
S: "seconds",
D: "totalDays",
I: "totalHours",
N: "totalMinutes",
T: "totalSeconds"
*/
所有的指令，包含0填充(01,02,03)和空白填充'1,2,3'版本，默认是0填充，不需要0填充，使用-%D。
-
模式：
- // 空白填充
! // 多元化复数模式
默认：复数添加 's'，单数不变
%!H // 当 hour>1，结尾添加 's'
%!H:hours // 当 hour>1，结尾添加 'hours'
%!H:hour,hours; // 当 hour>1，结尾添加 'hours'，hour<1，为单数，添加 'hour'。',' 分隔的，前为单数添加的字符，后为复数添加的字符
5.控制：
resume - 恢复
pause - 暂停
------------
start - 开始
stop - 停止
pause/resume，本质就是 start/stop 的别名
源码分析：
pause: function() {
this.stop();
},
resume: function() {
this.start();
},
6.countdown插件，本身只做时间的处理，并没做任何时间的默认展示，需要我们自己来做。
我们需要做的就是：
1.调用countdown()，传递一个 '终止时间'
2.绑定countdown相关事件，在事件内，进行我们的展示处理：
上面讲了事件的相关内容：
1>3个事件方法：
update.countdown
finish.countdown
stoped.countdown
2>每个事件的额外属性：
event.finalDate = this.finalDate; // 设定的终止时间
event.elapsed = this.elapsed; // 是否已经过期
event.offset = $.extend({}, this.offset); // 当前时间，在各个时间刻度上的计算
event.strftime = strftime(this.offset); // 格式化时间函数
示例：
$('#countdown').countdown("2017/5/1")
.on('update.countdown', function(){
format = "还剩%D天, %H时, %M分, %S秒开始抽奖"; // 指定格式字符串
$(this).html(event.strftime(format)); // 将格式字符串，传递给 'event.strftime()' 解析
})
.on('finish.countdown', function(){
$(this).html('开始抽奖');
});
转载自: https://blog.csdn.net/beyond__devil/article/details/70504654
