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 相关文章推荐
jQuery 下拉列表 二级联动插件分享
Mar 29 Javascript
12款经典的白富美型—jquery图片轮播插件—前端开发必备
Jan 08 Javascript
js 字符串转换成数字的三种方法
Mar 23 Javascript
jquery操作 iframe的方法
Dec 03 Javascript
jQuery中复合属性选择器用法实例
Dec 31 Javascript
完美实现仿QQ空间评论回复特效
May 06 Javascript
详解AngularJS控制器的使用
Mar 09 Javascript
Bootstrap Table服务器分页与在线编辑应用总结
Aug 08 Javascript
JS简单实现仿百度控制台输出信息效果
Sep 04 Javascript
jquery操作checkbox火狐下第二次无法勾选的解决方法
Oct 10 Javascript
实例解析jQuery工具函数
Dec 01 Javascript
AngularJS实现网站换肤实例
Feb 19 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中{}大括号是什么意思
2013/12/01 PHP
ThinkPHP3.1新特性之对分组支持的改进与完善概述
2014/06/19 PHP
简单理解PHP的面向对象编程方式
2016/05/17 PHP
TP5(thinkPHP5框架)实现显示错误信息及行号功能的方法
2019/06/03 PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
2020/02/28 PHP
如果文字过长,则将过长的部分变成省略号显示
2006/06/26 Javascript
jquery实现漂浮在网页右侧的qq在线客服插件示例
2013/05/13 Javascript
JS获取select的value和text值的简单实例
2014/02/26 Javascript
jquery实现的鼠标拖动排序Li或Table
2014/05/04 Javascript
编程语言JavaScript简介
2014/10/16 Javascript
基于JS实现EOS隐藏错误提示层代码
2016/04/25 Javascript
微信小程序实现实时圆形进度条的方法示例
2017/02/24 Javascript
angularJS实现动态添加,删除div方法
2018/02/27 Javascript
浅谈React碰到v-if
2018/11/04 Javascript
VUE+Element环境搭建与安装的方法步骤
2019/01/24 Javascript
JS中的算法与数据结构之链表(Linked-list)实例详解
2019/08/20 Javascript
node.js域名解析实现方法详解
2019/11/05 Javascript
在pycharm中开发vue的方法步骤
2020/03/04 Javascript
详解uniapp的全局变量实现方式
2021/01/11 Javascript
python操作xml文件示例
2014/04/07 Python
Python中使用md5sum检查目录中相同文件代码分享
2015/02/02 Python
python 排序算法总结及实例详解
2016/09/28 Python
使用Python处理BAM的方法
2018/09/28 Python
Python基础教程之异常详解
2019/01/10 Python
python使用参数对嵌套字典进行取值的方法
2019/04/26 Python
Pycharm 安装 idea VIM插件的图文教程详解
2020/02/21 Python
Python使用pyyaml模块处理yaml数据
2020/04/14 Python
Python多线程thread及模块使用实例
2020/04/28 Python
怎样让char类型的东西转换成int类型
2013/12/09 面试题
如何获取某个日期是当月的最后一天
2013/12/05 面试题
建筑施工实习自我鉴定
2013/09/19 职场文书
高中毕业生自我鉴定例文
2013/12/29 职场文书
护理专业毕业生自荐信
2014/06/15 职场文书
资源环境与城乡规划管理专业自荐书
2014/09/26 职场文书
学校艾滋病宣传活动总结
2015/05/09 职场文书
给老师的保证书怎么写
2015/05/09 职场文书