WeChat applet implements the countdown effect of obtaining verification code

不言
Release: 2018-06-27 11:08:18
Original
2311 people have browsed it

This article mainly introduces in detail the countdown effect of WeChat applet to obtain verification code. It has certain reference value. Interested friends can refer to it.

The example in this article is shared with everyone on WeChat. The specific code for the applet to achieve the countdown effect of the verification code is for your reference. The specific content is as follows

wxml

<button disabled=&#39;{{disabled}}&#39; data-id="2" bindtap="getVerificationCode">
{{time}}
</button>
Copy after login

js

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

})
Copy after login

The above is the entire content of this article. I hope it will be helpful to everyone’s study. More related content Please pay attention to PHP Chinese website!

Related recommendations:

The WeChat applet implements countdown and calls the camera’s automatic photo taking function

About the selector of the WeChat applet Analysis of (time, date, region)

WeChat applet dynamically displays the effect of project countdown

The above is the detailed content of WeChat applet implements the countdown effect of obtaining verification code. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template