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 相关文章推荐
JavaScript String.replace函数参数实例说明
Jun 06 Javascript
js实现当鼠标移到表格上时显示这一格全部内容的代码
Jun 12 Javascript
jQuery实现表格元素动态创建功能
Jan 09 Javascript
浅谈angular2的http请求返回结果的subcribe注意事项
Mar 01 Javascript
Angular使用$http.jsonp发送跨站请求的方法
Mar 16 Javascript
BootStrap表单验证 FormValidation 调整反馈图标位置的实例代码
May 17 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
Jun 28 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
Jul 18 Javascript
史上最全JavaScript常用的简写技巧(推荐)
Aug 17 Javascript
微信小程序调用摄像头隐藏式拍照功能
Aug 22 Javascript
vue左侧菜单,树形图递归实现代码
Aug 24 Javascript
在小程序中推送模板消息的实现方法
Jul 22 Javascript
基于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
30 个很棒的PHP开源CMS内容管理系统小结
2011/10/14 PHP
php在文件指定行中写入代码的方法
2012/05/23 PHP
解析mysql left( right ) join使用on与where筛选的差异
2013/06/18 PHP
CI框架源码解读之URI.php中_fetch_uri_string()函数用法分析
2016/05/18 PHP
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
nodejs 实现模拟form表单上传文件
2014/07/14 NodeJs
JS实现的5级联动Select下拉选择框实例
2015/08/17 Javascript
浅谈js中的三种继承方式及其优缺点
2016/08/10 Javascript
谈谈JS中常遇到的浏览器兼容问题和解决方法
2016/12/17 Javascript
如何学JavaScript?前辈的经验之谈
2016/12/28 Javascript
JavaScript实现图片切换效果
2017/08/12 Javascript
Vue中对比scoped css和css module的区别
2018/05/17 Javascript
详解nuxt sass全局变量(公共scss解决方案)
2018/06/27 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
2018/07/24 Javascript
简单易扩展可控性强的Jquery转盘抽奖程序
2019/03/16 jQuery
在JavaScript中如何访问暂未存在的嵌套对象
2019/06/18 Javascript
Nuxt.js实战和配置详解
2019/08/05 Javascript
Vue页面刷新记住页面状态的实现
2019/12/27 Javascript
如何在vue中使用百度地图添加自定义覆盖物(水波纹)
2020/11/03 Javascript
Python爬虫实现爬取京东手机页面的图片(实例代码)
2017/11/30 Python
python 定时器,实现每天凌晨3点执行的方法
2019/02/20 Python
使用Python脚本从文件读取数据代码实例
2020/01/19 Python
pytorch梯度剪裁方式
2020/02/04 Python
python微信公众号开发简单流程实现
2020/03/09 Python
Softmax函数原理及Python实现过程解析
2020/05/22 Python
css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
2016/12/06 HTML / CSS
英国皇室御用百货:福南梅森(Fortnum & Mason)
2017/12/03 全球购物
员工年终演讲稿
2014/01/03 职场文书
少儿节目主持串词
2014/04/02 职场文书
连带责任保证书
2014/04/29 职场文书
金融与证券专业求职信
2014/06/22 职场文书
社团活动总结书
2014/06/27 职场文书
创建绿色社区汇报材料
2014/08/22 职场文书
2014年平安建设工作总结
2014/11/19 职场文书
2016春季校长开学典礼致辞
2015/11/26 职场文书
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python