在项目中经常会用到倒计时功能,如发送手机验证码等等,索性自己写了一个小插件(依赖jquery或zepto):
/**
* 计时器
* @param options.disabledTime 时长
* @param options.disabledText 倒计时文本
* @param options.disabledCls 倒计时时元素样式
* @constructor
*/
var Timer = function (options) {
if (!options.el) return;
var $el = $(options.el);
var settings = {
disabledTime: 60,
enableText: $el.text(),
disabledText: "秒",
disabledCls: "btn-disabled"
}
$.extend(settings, options);
var disabledTime = settings.disabledTime;
$el.addClass(settings.disabledCls);
var count = function () {
disabledTime--;
if (disabledTime <= 0) {
clearTimeout(timeCount);
$el.text(settings.enableText).removeClass(settings.disabledCls);
disabledTime = settings.disabledTime;
return;
}
$el.text(disabledTime + settings.disabledText);
var timeCount = setTimeout(function () {
count();
}, 1000);
};
count();
}
var options={
//TODO
}
new Timer(options);
注:这样不管是集成到自己的框架或写在jquery插件里都是很方便的
posted on
浙公网安备 33010602011771号