当前位置:Gxlcms > JavaScript > AngularJS实现表单验证手机号功能

AngularJS实现表单验证手机号功能

时间:2021-07-01 10:21:17 帮助过:2人阅读

现在验证功能处处可见,做php开发的时候也是经常遇到,Angular表单验证分为两种验证:1.内置验证(required,minlength等);2.自定义验证(正则表达式)。本文小编就为大家带来一篇AngularJS 表单验证手机号的实例(非必填)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考,希望能帮助到大家。

代码如下所示:

<form ng-app="myApp" ng-controller="validateCtrl" 
name="myForm" novalidate>

<p>电话:<br>
<input type="text" name="phone" ng-model="phone" ng-pattern="/(^$)|^(((\+86)|(86))?1[34578]\d{9})$/">
<span style="color:red" ng-show="myForm.phone.$dirty && myForm.phone.$invalid">
  联系电话格式不正确!</span>
</p>

<p>
<input type="submit"
ng-disabled="myForm.$invalid">
</p>
</form>

正则表达式:

1. 匹配空:^$

2. 匹配手机号:^(((\+86)|(86))?1[34578]\d{9})$

3. 控制提示信息的显示:ng-show="myForm.phone.$dirty && myForm.phone.$invalid"

相关推荐:

详解Angular实现表单验证功能

手机注册时发送验证码倒计时功能

php 验证身份证号码

以上就是AngularJS 实现表单验证手机号功能的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行