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

最新推荐文章于 2025-06-11 17:33:01 发布

焕想-不怎么回复博客

最新推荐文章于 2025-06-11 17:33:01 发布

阅读量2.3w

点赞数 6

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/qq_38815953/article/details/79649315

本文介绍了一个微信小程序中实现表单验证的方法，包括对用户名和手机号的输入验证，并使用正则表达式检查输入是否符合规范。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这是page({})里的js

 data: {
    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;
    
  
  },

<view class='information'>填写信息</view>
<view class='top_line'></view>
<view class='name'>姓名</view>
<input class='btn'  type="text" placeholder='请输入预约人姓名' maxlength='12'value="" bindinput ="userNameInput" ></input>
<view class='line'></view>
<view class='call'>手机号</view>
<input class='btn' type="text" placeholder='请输入手机号' maxlength='11'value="" bindinput ="mobileInput" ></input>
<view class='line'></view>

<button class='confirm' type="submit" bindtap='btnclick' >确认预约</button>

姓名的判断没怎么写，稍后加上去