微信小程序实现发送短信倒计时功能的示例代码

2020-08-18 15:17:29
这篇文章主要介绍了微信小程序之发送短信倒计时功能,需要的朋友可以参考下

点击后

代码


<form bindsubmit="formSubmit" bindreset="formReset"> <view class="fidpas">  <input type="number" class="fidpas_inp"placeholder-class="lgin_place" placeholder="请输入手机号" name="phonenumber" />  <input type="number" class="fidpas_inp2"placeholder-class="lgin_place" placeholder="请输入短信验证码" name="msg" />  <button class="{{sendmsg}}" bindtap="sendmessg">{{getmsg}}</button> </view> <button class="lgbut" formType="submit">下一步</button> </form> data: {  sendmsg: "sendmsg",  getmsg:"获取短信验证码",  },  /**  * 获取短信验证码  */  sendmessg:function(e){  if (timer==1){  timer=0  var that=this  var time=60  that.setData({  sendmsg:"sendmsgafter",  })  var inter=setInterval(function(){   that.setData({   getmsg: time + "s后重新发送",   })   time--   if(time<0){   timer=1   clearInterval(inter)   that.setData({    sendmsg: "sendmsg",    getmsg: "获取短信验证码",   })   }  },1000)}  },

思路:将BUTTON后样式和内容设为变量,点击之后setData将其改变即可

总结