一、页面效果

二、json文件

//获取应用实例
const app = getApp()
Page({/*** 页面的初始数据*/data: {array: ['速美', '现代', '淮安'],mode: 'scaleToFill',src: '../../images/1.png',userInfo: {},hasUserInfo: false,canIUse: wx.canIUse('button.open-type.getUserInfo'),userName: '',mobile: ''},userNameInput: function(e) {this.setData({userName: e.detail.value})},mobileInput: function(e) {this.setData({mobile: e.detail.value})},btnclick: function() {var userName = this.data.userName;var mobile = this.data.mobile;var phonetel = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;var name = /^[u4E00-u9FA5]+$/;if (userName == '') {wx.showToast({title: '请输入用户名',icon: 'succes',duration: 1000,mask: true})return false} else if (mobile == '') {wx.showToast({title: '手机号不能为空',})return false} else if (mobile.length != 11) {wx.showToast({title: '手机号长度有误！',icon: 'success',duration: 1500})return false;}var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;if (!myreg.test(mobile)) {wx.showToast({title: '手机号有误！',icon: 'success',duration: 1500})return false;}return true;},//事件处理函数bindPickerChange: function(e) {console.log('picker发送选择改变，携带值为', e.detail.value)this.setData({index: e.detail.value})},bindViewTap: function() {wx.navigateTo({url: '../logs/logs'})},/*** 生命周期函数--监听页面加载*/onLoad: function(options) {if (app.globalData.userInfo) {this.setData({userInfo: app.globalData.userInfo,hasUserInfo: true})} else if (this.data.canIUse) {// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回// 所以此处加入 callback 以防止这种情况app.userInfoReadyCallback = res => {this.setData({userInfo: res.userInfo,hasUserInfo: true})}} else {// 在没有 open-type=getUserInfo 版本的兼容处理wx.getUserInfo({success: res => {app.globalData.userInfo = res.userInfothis.setData({userInfo: res.userInfo,hasUserInfo: true})}})}},getUserInfo: function(e) {console.log(e)app.globalData.userInfo = e.detail.userInfothis.setData({userInfo: e.detail.userInfo,hasUserInfo: true})},// 表单提交数据formSubmit: function(e) {console.log(e.detail.value)// var that = this;// var formData = e.detail.value;// wx.request({//   url: 'http://test.com:8080/test/socket.php?msg=2',//   data: formData,//   header: {//     'Content-Type': 'application/json'//   },//   success: function (res) {//     console.log(res.data)//     that.modalTap();//   }// })},formReset: function() {console.log('form发生了reset事件');},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function() {},/*** 生命周期函数--监听页面显示*/onShow: function() {},/*** 生命周期函数--监听页面隐藏*/onHide: function() {},/*** 生命周期函数--监听页面卸载*/onUnload: function() {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function() {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function() {},/*** 用户点击右上角分享*/onShareAppMessage: function() {}
})

三、wxml页面

<view class="container"><view class="userinfo"><button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button><block wx:else><image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image><text class="userinfo-nickname">{{userInfo.nickName}}</text></block></view><form bindsubmit="formSubmit" bindreset="formReset"><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/mine.png"></image><input name="mine" placeholder="姓名" maxlength='12'value="" bindinput ="userNameInput" /></view><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/phone.png"></image><input name="phone" placeholder="手机号" maxlength='11'value="" bindinput ="mobileInput" /></view><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/city.png"></image><input name="city" placeholder="城市" /></view><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/address.png"></image><input name="address" placeholder="地址" /></view><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/style.png"></image><picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">风格：{{array[index]}}</picker><!-- <input name="style" placeholder="风格" /> --></view><view class="section"><image style="width: 30px; height: 30px;" mode="{{mode}}" src="../../images/area.png"></image><input name="area" placeholder="面积" /></view><view class="btn-area"><button formType="reset" class='btn-left'>取消</button><button formType="submit" class='btn-right' bindtap='btnclick' >确定</button></view></form>
</view>

微信小程序正则判断姓名和手机号相关推荐

微信小程序正则判断手机号?
随便写的,希望对你有帮助, var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/; if (thi ...
微信小程序python解析获取用户手机号_微信小程序获取用户手机号详解
最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话 ...
微信小程序 error 用户绑定的手机号需要验证，请在客户端完成短信
微信小程序 error 用户绑定的手机号需要验证,请在客户端完成短信第一步在电脑上点编译第二步点击预览再点击自动预览第三步打开手机上的小程序确认授权输入短信验证码之后就可以运行了我点二维 ...
微信小程序中如何获取用户手机号授权登录
随着微信小程序的普及,许多应用程序需要用户登录才能提供更好的服务.而获取用户手机号码是验证用户身份和确保账户安全的重要步骤之一.因此,在本文中,我们将介绍如何在微信小程序中实现手机号授权登录. 步骤一 ...
微信小程序登录授权与授权手机号
文章目录前言微信小程序登录授权与授权手机号一.登录授权 1. 发送 res.code 到后台换取 openId, sessionKey 二.授权手机号官方规定因为需要用户主动触发才能发起获取 ...
微信小程序python解析获取用户手机号_微信小程序如何获取用户手机号
最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话 ...
小程序授权信息是保存在微信服务器,微信小程序登陆，授权，手机号授权流程及滚动穿透，保存图片等问题...
提纲: 滚动穿透登陆,授权流程手机号授权流程保存图片 webview的使用问题一二针对于,弹窗内容嵌套在蒙层内. 1. 点击弹窗外关闭, 你已经购买过该课程您已经购买该课程了,请前往听课去 ...
微信小程序python解析获取用户手机号_微信小程序获取用户手机号
获取微信用户绑定的手机号,需先调用wx.login接口. 小程序获取code. 后台得到session_key,openid. 组件触发getPhoneNumber 因为需要用户主动触发才能发起获取手 ...
微信中html5获取手机号,微信小程序通过用户授权获取手机号
这篇文章主要介绍了微信小程序如何通过用户授权获取手机号(getPhoneNumber),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下小程序有一个获 ...

微信小程序正则判断姓名和手机号

一、页面效果

二、json文件

三、wxml页面

微信小程序正则判断姓名和手机号相关推荐

最新文章

热门文章