微信小程序验证码获取倒计时

wxml

<button class="button" disabled='{{disabled}}' data-id="2" bindtap="getVerificationCode">{{time}}</button>

js

var interval = null //倒计时函数
Page({
 data: {
     date:'请选择日期',
     fun_id:2,
     time: '获取验证码', //倒计时 
     currentTime:61
 }, 
 getCode: function (options){
     var that = this;
     var currentTime = that.data.currentTime
     interval = setInterval(function () {
      currentTime--;
      that.setData({
        time: currentTime+'秒后重发'
      })
      if (currentTime <= 0) {
        clearInterval(interval)
        that.setData({
           time: '重新发送',
           currentTime:61,
           disabled: false
         })
      }
     }, 1000) 
 },
getVerificationCode(){
     this.getCode();
     var that = this;
     that.setData({
        disabled:true
     })
 }
 
})

wxss

.button{  
    width:260rpx;
    height:80rpx; 
    line-height: 50rpx; 
    padding: 10rpx 0;
    color: #000;
    font-size: 32rpx;
}

猜你喜欢

转载自www.cnblogs.com/DCL1314/p/9442045.html