AngularJS 表单验证手机号的实例(非必填)


Posted in Javascript onNovember 12, 2017

代码如下所示:

<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"

以上这篇AngularJS 表单验证手机号的实例(非必填)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Array.prototype.concat不是通用方法反驳[译]
Sep 20 Javascript
Jquery焦点与失去焦点示例应用
Jun 10 Javascript
javascript自定义函数参数传递为字符串格式
Jul 29 Javascript
jQuery中trigger()方法用法实例
Jan 19 Javascript
JS实现超精简响应鼠标显示二级菜单代码
Sep 12 Javascript
jquery实现加载进度条提示效果
Nov 23 Javascript
利用JS实现简单的日期选择插件
Jan 23 Javascript
基于 Vue 的树形选择组件的示例代码
Aug 18 Javascript
浅谈函数调用的不同方式,以及this的指向
Sep 17 Javascript
Vue-Router模式和钩子的用法
Feb 28 Javascript
微信小程序判断页面是否从其他页面返回的实例代码
Jul 03 Javascript
jquery实现上传文件进度条
Mar 26 jQuery
基于js中style.width与offsetWidth的区别(详解)
Nov 12 #Javascript
浅谈webpack下的AOP式无侵入注入
Nov 12 #Javascript
JQ图片文件上传之前预览功能的简单实例(分享)
Nov 12 #Javascript
JS实现小球的弹性碰撞效果
Nov 11 #Javascript
jQuery实现checkbox即点即改批量删除及中间遇到的坑
Nov 11 #jQuery
解决vue组件中使用v-for出现告警问题及v for指令介绍
Nov 11 #Javascript
JS Input里添加小图标的两种方法
Nov 11 #Javascript
You might like
Zend Studio 无法启动的问题解决方法
2008/12/04 PHP
PHP 变量类型的强制转换
2009/10/23 PHP
PHP原理之异常机制深入分析
2010/08/08 PHP
Laravel 加载第三方类库的方法
2018/04/20 PHP
PHP连接SQL server数据库测试脚本运行实例
2020/08/24 PHP
onpropertypchange
2006/07/01 Javascript
ExtJS 简介 让你知道extjs是什么
2008/12/29 Javascript
jquery 子窗口操作父窗口的代码
2009/09/21 Javascript
JavaScript对象学习经验整理
2013/10/12 Javascript
JavaScript数据库TaffyDB用法实例分析
2015/07/27 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
2015/08/12 Javascript
Jquery ajax加载等待执行结束再继续执行下面代码操作
2015/11/24 Javascript
JavaScript中的函数(二)
2015/12/23 Javascript
如何使用jquery修改css中带有!important的样式属性
2016/04/28 Javascript
AngularJS实现单独作用域内的数据操作
2016/09/05 Javascript
json的结构与遍历方法实例分析
2017/04/25 Javascript
webpack写jquery插件的环境配置
2017/12/21 jQuery
react-native android状态栏的实现
2018/06/15 Javascript
vue生成文件本地打开查看效果的实例
2018/09/06 Javascript
vue中,在本地缓存中读写数据的方法
2018/09/21 Javascript
[02:26]2016国际邀请赛8月3日开战 中国军团出征西雅图
2016/08/02 DOTA
Python单链表简单实现代码
2016/04/27 Python
python基础教程之五种数据类型详解
2017/01/12 Python
浅谈python中copy和deepcopy中的区别
2017/10/23 Python
python3实现网络爬虫之BeautifulSoup使用详解
2018/12/19 Python
Python enumerate函数遍历数据对象组合过程解析
2019/12/11 Python
浅谈tensorflow使用张量时的一些注意点tf.concat,tf.reshape,tf.stack
2020/06/23 Python
利用canvas实现图片下载功能来实现浏览器兼容问题
2019/05/31 HTML / CSS
师范生个人推荐信
2013/11/29 职场文书
电子商务专业自荐信
2014/06/02 职场文书
篮球比赛口号
2014/06/10 职场文书
法学专业毕业生自荐信
2014/06/11 职场文书
2015年置业顾问工作总结
2015/04/07 职场文书
学校远程教育工作总结
2015/08/11 职场文书
Pyhton模块和包相关知识总结
2021/05/12 Python
Java实现斗地主之洗牌发牌
2021/06/14 Java/Android