vue中手机号,邮箱正则验证以及60s发送验证码
2018-01-31 21:21
711 查看
今天写了一个简单的验证,本来前面用的组件,但是感觉写的组件在此项目不是很好用,由于用到的地方比较少,所以直接写在了页面中。页面展示如图
这里是
2017年10月31日发布
新浪微博
微信
Twitter
Facebook
赞 | 0
收藏 | 2
<div> <p class="fl"> <input name="phone" type="number" placeholder="手机号" v-model="phone"/> <button type="button" :disabled="disabled" @click="sendcode" class="btns">{{btntxt}}</button> </p> <p class="fl" style="margin-left: 20px;"> <input type="text" placeholder="验证码"/> </p> </div> <input type="button" value="查询" class="btns search" @click="query"/>
这里是
script里的内容
export default { data: function () { return { disabled:false, time:0, btntxt:"获取验证码", formMess:{ email:this.email, phone:this.phone } } }, mounted: function () { }, methods:{ //验证手机号码部分 sendcode(){ var reg=11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/; //var url="/nptOfficialWebsite/apply/sendSms?mobile="+this.ruleForm.phone; if(this.phone==''){ alert("请输入手机号码"); }else if(!reg.test(this.phone)){ alert("手机格式不正确"); }else{ this.time=60; this.disabled=true; this.timer(); /*axios.post(url).then( res=>{ this.phonedata=res.data; })*/ } }, timer() { if (this.time > 0) { this.time--; this.btntxt=this.time+"s后重新获取"; setTimeout(this.timer, 1000); } else{ this.time=0; this.btntxt="获取验证码"; this.disabled=false; } }, query(){ var formMess=this.formMess Axios.post(api+"/order/select/reception", formMess) .then(function (res) { if(res.data.code==200){ console.log(res.data.data); this.productResult=res.data.data; this.productResult.length=3; }else if(res.data.code==400){ alert(res.data.message) } }.bind(this)) }, //邮箱验证 sendEmail(){ var regEmail= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/; if(this.email==''){ alert("请输入邮箱"); }else if(!regEmail.test(this.email)){ alert("邮箱格式不正确"); } } } }
2017年10月31日发布
新浪微博
微信
赞 | 0
收藏 | 2
相关文章推荐
- vue中手机号,邮箱正则验证以及60s发送验证码的实例
- JS正则表达式验证账号、手机号、电话和邮箱是否合法
- 常用的正则表达式来验证信息.如:网址 邮箱 手机号等
- JS正则表达式验证账号、手机号、电话、邮箱、货币
- 用正则表达式验证邮箱和手机号
- 用正则表达式验证邮箱和手机号
- 正则表达式,验证身份证,手机号,电话号码,邮箱,邮编,日期,正负数,英文字符串等
- 邮箱、帐号、手机号和电话的javascript正则表达式验证方法
- js正则表达式手机号(邮箱)验证
- jQuery验证手机号邮箱身份证的正则表达式(含港澳台)
- JS正则表达式验证账号、手机号、电话和邮箱
- 使用正则表达式验证注册页面(用户名,密码,确认密码,邮箱,手机号)
- ajax正则,php正则验证表单以及验证码
- jQuery 找回密码三步验证邮箱正则表达式 验证手机 获取验证码倒计时 php版
- JS正则表达式验证账号、手机号、电话和邮箱
- 转:JS正则表达式验证账号、手机号、电话和邮箱
- JS获取当前网址信息与JS正则表达式验证账号、手机号、电话和邮箱
- 用正则表达式验证邮箱和手机号
- Android正则验证手机号,身份证号,邮箱等格式是否正确
- js页面正则表达式验证用户名为手机号或邮箱