小程序获取手机验证码倒计时的方法_javascript技巧_

.bind_input{ width: 450rpx; height: 80rpx; padding: 0 20rpx; margin: 0 auto 20rpx auto; border-radius: 40rpx; border: #ddd solid 1px;     display: flex; justify-content: space-between; align-items: center; } .bind_input input{ width: 230rpx; height: 50rpx; padding-left: 30rpx;} .bind_yzm_btn{ width: 160rpx; height: 50rpx; line-height: 50rpx; text-align: center; color: #fff; font-size: 24rpx; border-radius: 25rpx; background-color: #0FC393;} .bind_yzm_btn.grey{ font-size: 28rpx; background-color: #ccc;}   .bind_btn{ width: 450rpx; height: 80rpx; line-height: 80rpx; margin: 40rpx auto 0 auto; text-align: center; color: #fff; font-size: 36rpx; font-weight: 300; border-radius: 40rpx; background-color: #0FC393;     box-shadow:0px 10px 20px rgba(0,182,142,0.4); }

                  {{timeCur}}     获取验证码   确定

Page({     /**    * 页面的初始数据    */   data: {         mobile:'',         code:'',                  // 倒计时参数         timeStart:60, //倒计时初始值         timeCur:null, //当前倒计时显示值         timer:null,                  ifTimeIn:false, //是否倒计时中                  ifSendMobileVerify:false, //是否发送成功验证码   },          // 设置用户输入的手机号     setMobile(e){         // console.log(e.detail.value);         this.setData({             mobile : e.detail.value.replace(/\s+/g,"")         });     },          // 设置用户输入的验证码     setCode(e){         // console.log(e.detail.value);         this.setData({             code : e.detail.value.replace(/\s+/g,"")         });     },                    // 倒计时     setTime(){         let timeCur = this.data.timeCur - 1;         // console.log(timeCur);         if(timeCur < 0){             clearInterval(this.data.timer);             this.setData({                 ifTimeIn:false             });             return false;         }         this.setData({             timeCur : timeCur         });     },          // 获取验证码     getMobileVerify(){         if(!this.data.mobile){             wx.showModal({                 title: '友情提示',                 content: '请输入手机号',                 showCancel: false,             });             return false         }                  if(!/^1\d{10}$/.test(this.data.mobile)){             wx.showModal({                 title: '友情提示',                 content: '请输入正确的手机号',                 showCancel: false,             });             return false;         }                  wx.showLoading({           title: "发送中",           mask: true         });                  let dataJson = {             mobile : this.data.mobile,         };                  /* ----请求后台发送验证码成功---- */         // 执行倒计时         this.setData({             timeCur : this.data.timeStart,             timer : setInterval(this.setTime,1000),             ifTimeIn : true,             ifSendMobileVerify : true         });         /* ----请求后台发送验证码成功---- */         wx.hideLoading();     },          // 确定提交     bindDo(){         if(!this.data.ifSendMobileVerify){             wx.showModal({                 title: '友情提示',                 content: '请确定您的手机收到验证码再操作',                 showCancel: false,             });             return false;         }         if(!this.data.code){             wx.showModal({                 title: '友情提示',                 content: '请输入验证码',                 showCancel: false,             });             return false;         }                  /* ----请求后台提交成功---- */         wx.showToast({             title: '成功',             icon: 'success',             mask: true,             duration: 1500         });         /* ----请求后台提交成功---- */     },     /**    * 生命周期函数--监听页面显示    */   onShow: function () {     }, })