微信小程序实现手机号码验证

这篇文章主要为大家详细介绍了微信小程序实现手机号码验证,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了微信小程序实现手机号码验证的具体代码,供大家参考,具体内容如下

wxml

      手机号:        

wxss

.all {   border-top: 1rpx solid #efefef;   border-bottom: 1rpx solid #efefef;   height: 98rpx;   font-size: 28rpx;   display: flex;   align-items: center; }   button {   width: 480rpx;   height: 80rpx;   background-color: #7ecffd;   font-size: 30rpx;   color: #fff;   border-radius: 8px;   margin: 50rpx auto; }

js

Page({     /**    * 页面的初始数据    */   data: {     ajxtrue: false,   },   // 手机号验证   blurPhone: function(e) {     var phone = e.detail.value;     let that = this     if (!(/^1[34578]\d{9}$/.test(phone))) {         this.setData({         ajxtrue: false       })       if (phone.length >= 11) {         wx.showToast({           title: '手机号有误',           icon: 'success',           duration: 2000         })       }     } else {       this.setData({         ajxtrue: true       })       console.log('验证成功', that.data.ajxtrue)     }   },   // 表单提交   formSubmit(e) {     let that = this     let val = e.detail.value     let ajxtrue = this.data.ajxtrue     if (ajxtrue == true) {       //表单提交进行     } else {       wx.showToast({         title: '手机号有误',         icon: 'success',         duration: 2000       })     }   },   /**    * 生命周期函数--监听页面加载    */   onLoad: function(options) {     },     /**    * 生命周期函数--监听页面初次渲染完成    */   onReady: function() {     },     /**    * 生命周期函数--监听页面显示    */   onShow: function() {     },     /**    * 生命周期函数--监听页面隐藏    */   onHide: function() {     },     /**    * 生命周期函数--监听页面卸载    */   onUnload: function() {     },     /**    * 页面相关事件处理函数--监听用户下拉动作    */   onPullDownRefresh: function() {     },     /**    * 页面上拉触底事件的处理函数    */   onReachBottom: function() {     },     /**    * 用户点击右上角分享    */   onShareAppMessage: function() {     } })

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持0133技术站。

以上就是微信小程序实现手机号码验证的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » JavaScript 教程