小程序绑定手机，发送验证码

<view class='page'><view class="weui-cells weui-cells_after-title"><view class="weui-cell weui-cell_input"><view class="weui-cell__hd"><view class="weui-label">手机号</view></view><view class="weui-cell__bd"><input class="weui-input" value='{{tel}}' bindinput='inputset' data-ac-hi="tel" data-ac-hi="tel" placeholder="请输入手机号"/></view></view><view class="weui-cell weui-cell_input weui-cell_vcode"><view class="weui-cell__hd"><view class="weui-label">验证码</view></view><view class="weui-cell__bd"><input class="weui-input"  bindinput='inputset' data-ac-hi="yzms"  placeholder="验证码" /></view><view class="weui-cell__ft"><view style='color:{{color}}' class="weui-vcode-btn" bindtap='{{yzm}}'>{{MSM_loding}}</view></view></view></view><view class="weui-btn-area"><button style='background-color: #EB6102' class="weui-btn" type="primary" bindtap="submitbyy">确定</button></view>
</view>
<view class="ad_popError11111" wx:if="{{popErrorMsg!=''}}">{{popErrorMsg}}</view>

// pages/bind_tel/bind_tel.js
const app = getApp();
let wx_request = require('../../utils/wx_request_zr.1.0.1.js');
let Verification_common = require('../../utils/Verification_common.js');
let common = require('../../utils/common.js');
Page({/*** 页面的初始数据*/data: {MSM_loding: "发送验证码",color: null,yzm: "getyzm",popErrorMsg: "",tel: "",a:true,yzms : ""},ohShitfadeOut: function(e) {this.setData({popErrorMsg: e});var fadeOutTimeout = setTimeout(() => {this.setData({popErrorMsg: ''});clearTimeout(fadeOutTimeout);}, 2000);},getyzm: function() {if (!Verification_common.tel(this.data.tel)) {this.ohShitfadeOut("请正确填写手机号码")return false;}const thast = this;common.SMS_verification(this.data.tel,function(){thast.sms_lodining();});},getmaxs : function(){this.ohShitfadeOut("请稍后")},sms_lodining : function(){if (this.data.MSM_loding<=0){this.setData({MSM_loding: "发送验证码",color: null,yzm: "getyzm",a:true})return false;}if(this.data.a){this.setData({MSM_loding:  60 ,color: "red",yzm: "getmaxs",a:false})var fadeOutTimeout = setTimeout(() => {this.sms_lodining()clearTimeout(fadeOutTimeout);}, 1000);}else{var a = this.data.MSM_loding-1;this.setData({MSM_loding: a})var fadeOutTimeout = setTimeout(() => {this.sms_lodining()clearTimeout(fadeOutTimeout);}, 1000);}},inputset: function(e) {if (e.currentTarget.dataset.acHi == "tel") {this.setData({tel: e.detail.value})} else if (e.currentTarget.dataset.acHi == "yzms") {this.setData({yzms: e.detail.value})}},submitbyy:function(){if (!Verification_common.tel(this.data.tel)) {this.ohShitfadeOut("请正确填写手机号码")return false;}if (this.data.yzms.length!=6) {this.ohShitfadeOut("请正确填写验证码")return false;}new wx_request({url: "appmyrelease/renting",data: {MEMBER_ID: app.globalData.men_openid,TEL: this.data.tel,CODE: this.data.yzms},success: function (res) {if (res.data.type == true){wx.showToast({title: '绑定成功',icon: 'none'})setTimeout(function () {wx.navigateBack();}, 500)} else {wx.showToast({title: res.data.msg,icon: 'none'})} }})},/*** 生命周期函数--监听页面加载*//*** 生命周期函数--监听页面初次渲染完成*/onReady: function() {},/*** 生命周期函数--监听页面显示*/onShow: function() {},/*** 生命周期函数--监听页面隐藏*/onHide: function() {},/*** 生命周期函数--监听页面卸载*/onUnload: function() {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function() {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function() {},/*** 用户点击右上角分享*/onShareAppMessage: function() {}
})

/* g_details/g_details.wxss */
page{background: rgb(241, 241, 241);
}.content{padding: 0.5em 1.5em;width: calc(100% - 3em);margin: 1em 0;background: white;
}.contentt{width: 100%;padding: 1em 0;margin: 1em 0;background: white;
}.content .title{font-size: 0.8em;font-weight: 600;width: 100%;margin: 0.5em 0;
}.content .index{font-size: 0.8em;width: 100%;text-align: right;color: rgb(114, 114, 114);
}.contentt .titlee{font-size: 0.8em;font-weight: 600;width: 100%;margin: 0.5em 0;
}.contentt .indexx{font-size: 0.8em;width: 100%;margin: 0.5em 0;color: rgb(114, 114, 114);
}.button {border-top: 1px solid #ddd;
}.button view{line-height: 3.5em;border-bottom: 1px solid #ddd;
}.button view:active{background: rgba(0,0,0,0.1);
}
.page-body{height: 12em;width:100%;
}.page-body .page-section{width: 100%;height: 100%;
}.page-body .page-section map{width: 100%;height: 100%;
}

小程序绑定手机，发送验证码相关推荐

微信小程序---实现手机号发送验证码登录
1.前端页面wxml  <view class="container"><view cl ...
微信小程序授权登录+手机发送验证码+jwt验证接口（laravel8+php）
参考博客小程序授权登录并 laravel7(laravel8) token 应用 - 王越666 - 博客园微信小程序sku商品规格选择器 - 简书微信小程序和 laravel8 实现搜索后分 ...
微信小程序获取手机验证码短信验证码后端功能实现解析
本文原创首发CSDN,链接 https://mp.csdn.net/console/editor/html/106041472 ,作者博客https://blog.csdn.net/qq_414641 ...
小程序实现手机短信验证功能
小程序实现手机短信验证功能废话不多说,直接把项目写的手机短信验证功能发出来 .wxml <form bindsubmit="phone"> <input typ ...
小程序：js获取验证码时（倒计时模块）
代码例子截图最近在上手开发小程序,发现其实小程序要比vue真的要简单太多了,有一套自己的html(WXML),css(WXSS),虽然有些标签不能直接沿用html5的标签来开发,不过内置的标签还是很好 ...
实现微信小程序和手机app远程控制51单片机控制L298N电机驱动器控制马达（ESP8266 AT89S52 http请求转串口通信系统 mqtt ）
首先你有这样的8266 这种8266自身带2个按键和烧录芯片方便调试,综合性价比较高. 还有就是你需要有一个51单片机或者其他芯片都行.有了这2个芯片我们开始吧! 1.先看一段视频效果演示,再来介绍实 ...
html给手机号发送验证码,js如何实现手机发送验证码功能
js如何实现手机发送验证码功能发布时间:2021-06-21 12:24:46 来源:亿速云阅读:82 作者:小新这篇文章将为大家详细讲解有关js如何实现手机发送验证码功能,小编觉得挺实用的,因 ...
健康管理系统第七天（移动端_体检预约(手机号校验、发送验证码之后30秒倒计时效果、生成验证码、向手机发送验证码)）
一.体检预约流程用户可以通过如下操作流程进行体检预约: 1.在移动端首页点击体检预约,页面跳转到套餐列表页面 2.在套餐列表页面点击要预约的套餐,页面跳转到套餐详情页面 3.在套餐详情页面点击立即预 ...
手机发送验证码的业务逻辑探究-主要是安全性,响应性
手机发送验证码的业务逻辑探究-主要是安全性,响应性这样一来,只要知道静态的验证码是什么,脚本就可以轻松填写正确的验证码. 解决方法: 1后台是否可以限制一个IP发送的次数 2限定发送验证码的一分钟的 ...

小程序绑定手机，发送验证码

小程序绑定手机，发送验证码相关推荐

最新文章

热门文章