Mikel
目前版本为：jCountdown JQuery Plugin – v1.5.2 – 2014-07-29
下载地址：https://github.com/tomgrohl/jCountdown/
这个插件使用比较简单，难得的是一个版本一个版本在不断做着升级优化。非常符合我选择插件的要求。
介绍下如何使用：
1、引用JQuery.jcountdown.js文件。
2、html里面添加给要显示倒计时的区域添加id名。例：
3、调用，填写相应参数。
$(document).ready(function() {
$("#countdown").countdown({
date: "August 15, 2014 09:59",
omitZero: false,//省略0
//minsOnly: true,
leadingZero: false, //前导0
//yearsAndMonths: true, //年月
//weeks: true //周
});
});
|
由于为外国人开发所显示的为日期名称为英文，还好有参数，方便修改。另一例调用方法，如下。
// 倒计时
var dateTo = "August 15, 2014 00:00"
$("#time").countdown({
yearText: '年',
monthText: '月',
weekText: '周',
dayText: '天',
hourText: '时',
minText: '分',
secText: '秒',
yearSingularText: '年',
monthSingularText: '月',
weekSingularText: '周',
daySingularText: '天',
hourSingularText: '时',
minSingularText: '分',
secSingularText: '秒',
date: dateTo,
omitZero: false
});
|
在这个过程中，产品有个需求是去掉“秒”的展示，通过简易模板配置可以完成。代码如下：
$(document).ready(function() {
// Tokens available: %y = years, %m = months, %w = weeks, %d = days, %h = hours, %i = minutes, %s = seconds
$("#countdown").countdown({
date: "september 10, 2015 12:35",
//yearsAndMonths: true,
template: '%d %h %i'
});
});
|
ps：此插件支持一个页面有多个倒计时存在。还包含了一些方法，请查看示例。
设置时间时不能设为24:00，否则在chrome下会出现：Uncought Error:Invalid Date passer to jCountdown
