验证码倒计时代码封装(对象封装)

/*
 * 封装验证码倒计时对象
 * 调用规则,必须是input type="button"元素来调用
 * 例如:
 *  <input type="button" class="get_code" value="获取验证码"></input >
 *  var newCode = new GetCode($('.get_code').get(0));
 *  newCode.sendCode();
 * */
function GetCode (element){
    this._init_(element);
}
GetCode.prototype = {
    constructor : GetCode,
    _init_ : function(element) {
        this.clock = '';
        this.nums = 60;
        this.btn = element;
    },
    sendCode: function (){
        this.btn.disabled = true; //将按钮置为不可点击
        this.btn.value = this.nums + '秒后可重发';
        var that = this
        this.clock = setInterval(this.doLoop(that), 1000); //一秒执行一次
    },
    /*需要注意的地方*/
    doLoop: function(that){
        var fuc = function(){
            that.nums--;
            if(that.nums > 0) {
                that.btn.value = that.nums + '秒后可重发';
            } else {
                clearInterval(that.clock); //清除js定时器
                that.btn.disabled = false;
                that.btn.value = '获取验证码';
                that.nums = 60; //重置时间
            }
        }
        return fuc; 
    }
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值