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 相关文章推荐
同一页面多个商品倒计时JS 基于面向对象的javascript
Feb 16 Javascript
js中onload与onunload的使用示例
Aug 25 Javascript
javascript运动框架用法实例分析(实现放大与缩小效果)
Jan 08 Javascript
基于javascript实现tab选项卡切换特效调试笔记
Mar 30 Javascript
JS实现HTML表格排序功能
Aug 05 Javascript
jQueryUI Datepicker组件设置日期高亮
Oct 13 Javascript
node.js程序作为服务并在windows下开机自启动(用forever)
Mar 29 Javascript
element-ui upload组件多文件上传的示例代码
Oct 17 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【凹多边形的分离轴检测算法】
Dec 13 Javascript
傻瓜式vuex语法糖kiss-vuex整理
Dec 21 Javascript
解决layer图标icon不加载的问题
Sep 04 Javascript
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
Nov 18 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
php strrpos()与strripos()函数
2013/08/31 PHP
PHP使用递归算法无限遍历数组示例
2017/01/13 PHP
深入理解PHP的远程多会话调试
2017/09/21 PHP
Django 标签筛选的实现代码(一对多、多对多)
2018/09/05 PHP
php高性能日志系统 seaslog 的安装与使用方法分析
2020/02/29 PHP
点击弹出层效果&amp;弹出窗口后网页背景变暗效果的实现代码
2014/02/10 Javascript
JavaScript中的数组操作介绍
2014/12/30 Javascript
学习JavaScript事件流和事件处理程序
2016/01/25 Javascript
BootStrap创建响应式导航条实例代码
2016/05/31 Javascript
利用Node.js编写跨平台的spawn语句详解
2017/02/12 Javascript
Bootstrap缩略图的创建方法
2017/03/22 Javascript
Bootstrap滚动监听组件scrollspy.js使用方法详解
2017/07/20 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
2017/12/13 Javascript
JavaScript实现微信红包算法及问题解决方法
2018/04/26 Javascript
解决Nodejs全局安装模块后找不到命令的问题
2018/05/15 NodeJs
如何在 JavaScript 中更好地利用数组
2018/09/27 Javascript
vue-router路由模式详解(小结)
2019/08/26 Javascript
[25:59]Newbee vs TNC 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python基类函数的重载与调用实例分析
2015/01/12 Python
Python中生成器和yield语句的用法详解
2015/04/17 Python
在Mac OS系统上安装Python的Pillow库的教程
2015/11/20 Python
python实现批量监控网站
2016/09/09 Python
详解使用 pyenv 管理多个版本 python 环境
2017/10/19 Python
详解pandas的外部数据导入与常用方法
2019/05/01 Python
django2.2安装错误最全的解决方案(小结)
2019/09/24 Python
python 如何调用 dubbo 接口
2020/09/24 Python
基于python实现监听Rabbitmq系统日志代码示例
2020/11/28 Python
HTML5微信播放全屏问题的解决方法
2017/03/09 HTML / CSS
韩国三大免税店之一:THE GRAND 中文免税店
2016/07/21 全球购物
YSL圣罗兰美妆英国官网:Yves Saint Laurent Beauty UK
2019/08/03 全球购物
波兰品牌鞋履在线商店:Eastend.pl
2020/01/11 全球购物
2016春节慰问信范文
2015/03/25 职场文书
如何写辞职信
2015/05/13 职场文书
美容院管理规章制度
2015/08/05 职场文书
MySQL中distinct与group by之间的性能进行比较
2021/05/26 MySQL
解决pytorch读取自制数据集出现过的问题
2021/05/31 Python