微信小程序-获取验证码

　　　　

 

 

 

<view class="form_group">
      <view class="title"><span class="red_tip">*</span>3. 手机号(<span class="bitian">必填</span>)</view>
      <input placeholder="请输入" bindblur="checkPhone" name="phone" value="{{phone}}" maxlength="11" ></input>
</view>
<view class="form_group">
      <view class="title"><span class="red_tip">*</span>4. 验证码（<span class="bitian">必填</span>）</view>
      <view class="group_con">
           <input placeholder="请输入" bindblur="getCodeValue" name="code" value="{{code}}" maxlength="6" class="con_l"></input>
           <view class="con_r">
              <button class='r_btn' bindtap='getVerificationCode' disabled='{{disabled}}' size="mini">{{codename}}</button>
           </view>
      </view>
</view>

 

 code: '', //验证码
 codename: '获取验证码',

 
 checkPhone: function (e) {
    this.setData({
      phone: e.detail.value
    })
  },

  getCodeValue: function (e) {
    this.setData({
      code: e.detail.value
    })
  },

  getCode: function () {
    var a = this.data.phone;
    var _this = this;
    var myreg = /^1[3456789]\d{9}$/;
    if (this.data.phone == "") {
      _this.setData({
        disabled: false
      })
      wx.showToast({
        title: '手机号不能为空',
        icon: 'none',
        duration: 1000
      })
      return false;
    } else if (!myreg.test(this.data.phone)) {
      _this.setData({
        disabled: false
      })
      wx.showToast({
        title: '请输入正确的手机号',
        icon: 'none',
        duration: 1000
      })
      return false;
    } else {
      _this.setData({
        disabled: true
      })
      var num = 61;
      var timer = setInterval(function () {
        num--;
        if (num <= 0) {
          clearInterval(timer);
          _this.setData({
            codename: '重新发送',
            disabled: false
          })

        } else {
          _this.setData({
            codename: num + "s"
          })
        }
      }, 1000)
    }
  },
  //获取验证码
  getVerificationCode() {
    this.getCode();
  },