VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码（图文详情）

VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码

先看效果图

第一步：写布局

<input type="text" placeholder="请输入手机号" v-model="phonenumber">
// 实时获取input框输入的手机号<p  v-if="!isShow">请输入正确的手机号</p>// 如果是true则显示，反之则消失<button @click="testFn" >  获取验证码 </button>// 调用testFn方法，用来验证输入的手机号是否正确

第二步：data中定义phonenumber用来实时获取input框输入的电话号

data () {return {phonenumber: ''，isShow： true// 初始值是true，因为v-if时是！isShow，是false不显示}},

第三步：methods写testFn方法

methods: {testFn () {let re = /^1(3|4|5|6|7|8|9)\d{9}$/// 正则，验证手机号输入是否正确let show = re.test(this.phonenumber)// 若正确返回true，反之falsethis.isShow = show// isShow获取之后返回到v-if进行判断是消失还是出现if (this.isShow) {this.$router.push('/Login_test')// 一定要进行判断，只有返回的是true才证明输入电话号码正确，才能跳转到下一页获取验证码}}}

若号码正确则跳转到验证码页

VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码（图文详情）相关推荐

jQuery Validate表单中文正则验证+手机号正则验证
话不多说先上图 <!DOCTYPE html> <html> <head><meta charset="utf-8"><tit ...
jquery php验证手机号码,使用jQuery如何实现手机号正则验证输入
这篇文章主要介绍了jQuery实现手机号正则验证输入及自动填充空格功能,涉及jQuery事件响应.字符串遍历及正则判断等相关操作技巧,需要的朋友可以参考下本文实例讲述了jQuery实现手机号正则验证 ...
vue+elementui 手机号正则验证
vue+elementui手机号正则校验 1. /^1(3|4|5|7|8|9)\d{9}$/ 2. /^1[3456789]\d{9}$/// 在表单rules中可以这样写规则验证rules:[mo ...
js正则验证人名，包含· | 手机号正则验证（199）
姓名验证(包含中间带点格式 ): /^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/ 手机格式验证(199.移动198.联通166号): /^(13[0-9]|14[5- ...
MySQL 2019最全的国家地区代码、手机号正则验证，覆盖191个国家和地区
功能亮点: 最新的手机号正则表达式,基于2018年12月份制作: 最全的手机号正则匹配和验证,涵盖191个国家和地区: 在多个大项目中实践,完美无压力,适应更多应用场景: 注意事项关于JQ中ajax ...
sql实现手机号正则验证
需求(奇怪的),使用sql编写一个验证手机号的功能众所周知,验证这类东西都是用正则来做的前端或者后台都可以轻松实现这类验证,比如身份证验证,邮箱验证,手机号验证... 但是数据库中又没有正则 ...
2021年最新js手机号正则验证最全全部号段
手机号验证正则 /^1[3-9]\d{9}$/ js的例子 isphone.html <html> <body> <input id="Tel" ty ...
java手机号正则验证（中国手机号）
/*** 验证中国手机号* 前两位为13 后一位为数字0到9* 前两位为14 后一位为5,7,9* 前两位为15 后一位为0到3,5到9* 前三位为166* 前两位为17 后一位为3,5,6,7,8* ...
邮箱、微信号、手机号正则验证
const mobileReg = /^[a-zA-Z][a-zA-Z0-9_-]{5,19}$/if(!mobileReg.test(this.formData.mobile)){return un ...

VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码（图文详情）

VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码

VUE—移动端手机号正则验证，不正确显示‘请输入正确手机号’，若正确跳转到发送验证码（图文详情）相关推荐

最新文章

热门文章