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 相关文章推荐
使用户点击后退按钮使效三行代码
Jul 07 Javascript
一个js封装的不错的选项卡效果代码
Feb 15 Javascript
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
Feb 27 Javascript
浅析LigerUi开发中谨慎载入common.css文件
Jul 09 Javascript
Javascript 函数parseInt()转换时出现bug问题
May 20 Javascript
jquery中页面Ajax方法$.load的功能使用介绍
Oct 20 Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 Javascript
JavaScript截断字符串的方法
Jul 15 Javascript
Backbone.js框架中Model与Collection的使用实例
May 07 Javascript
JS实现放烟花效果
Mar 10 Javascript
JavaScript, select标签元素左右移动功能实现
May 14 Javascript
nestjs中异常过滤器Exceptionfilter的具体使用
Feb 07 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
让的PHP代码飞起来的40条小技巧(提升php效率)
2010/04/12 PHP
关于shopex同步ucenter的redirect问题,导致script不运行
2013/04/10 PHP
浅析PHP绘图技术
2013/07/03 PHP
php实现图片文件与下载文件防盗链的方法
2014/11/03 PHP
学习php设计模式 php实现合成模式(composite)
2015/12/08 PHP
Jquery 弹出层插件实现代码
2009/10/24 Javascript
NodeJS与Mysql的交互示例代码
2013/08/18 NodeJs
用jQuery与JSONP轻松解决跨域访问的问题
2014/02/04 Javascript
Javascript 按位与赋值运算符 (&amp;=)使用介绍
2014/02/04 Javascript
JS拖拽插件实现步骤
2015/08/03 Javascript
原生javascript实现图片无缝滚动效果
2016/02/12 Javascript
JavaScript中的splice方法用法详解
2016/07/20 Javascript
简单理解vue中el、template、replace元素
2016/10/27 Javascript
Javascript中Promise的四种常用方法总结
2017/07/14 Javascript
AngularJS上传文件的示例代码
2018/11/10 Javascript
vue-router懒加载速度缓慢问题及解决方法
2018/11/25 Javascript
vue中使用GraphQL的实例代码
2019/11/04 Javascript
Vue两种组件类型:递归组件和动态组件的用法
2020/08/06 Javascript
[06:07]刀塔密之二:攻之吾命受之吾幸
2014/07/03 DOTA
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
pandas去重复行并分类汇总的实现方法
2019/01/29 Python
运用PyTorch动手搭建一个共享单车预测器
2019/08/06 Python
python双向链表原理与实现方法详解
2019/12/03 Python
使用python接受tgam的脑波数据实例
2020/04/09 Python
keras K.function获取某层的输出操作
2020/06/29 Python
keras自动编码器实现系列之卷积自动编码器操作
2020/07/03 Python
印度服装购物网站:Limeroad
2018/09/26 全球购物
法律专业应届本科毕业生求职信
2013/10/25 职场文书
高中毕业生个人自我鉴定
2013/11/24 职场文书
幼儿园毕业教师感言
2014/02/21 职场文书
品酒会策划方案
2014/05/26 职场文书
大专毕业生自我鉴定范文(2篇)
2014/09/27 职场文书
长城导游词
2015/01/30 职场文书
硕士学位申请报告
2015/05/15 职场文书
会议室管理制度范本
2015/08/06 职场文书
Django数据库(SQlite)基本入门使用教程
2022/07/07 Python