AngularJS 表单验证手机号(非必填)
代码:
<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 表单验证手机号(非必填)的更多相关文章
- AngularJs表单验证
常用的表单验证指令 1. 必填项验证 某个表单输入是否已填写,只要在输入字段元素上添加HTML5标记required即可: <input type="text" requir ...
- angularjs表单验证checkbox
angularjs中默认有表单验证的支持,见文末的refer 我想要验证至少要选择一个checkbox,否则就不能提交 但是checkbox貌似没有简单的方法,想来想去给出下面的解决方案 valida ...
- 【AngularJS学习笔记】AngularJS表单验证
AngularJS表单验证 AngularJS提供了一些自带的验证属性 1.novalidate:添加到HTML的表单属性中,用于禁用浏览器默认的验证. 2.$dirty 表单有填写记录 3.$v ...
- AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)
一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...
- AngularJS表单验证,手动验证或自动验证
AngularJS的表单验证大致有两种,一种是手动验证,一种是自动验证. 手动验证 所谓手动验证是通过AngularJS表单的属性来验证.而成为AngularJS表单必须满足两个条件:1.给form元 ...
- AngularJS 表单验证小结
注:本文所述的表单验证即AngularJS自带的表单验证,无需引入第三方的插件 一.常用的验证特性标签 1.非空 为input加入一个required属性即可,例如: <input type=& ...
- 彻底弄懂angularJS表单验证
常用的表单验证指令 (基本概念) 1. 必填项验证 某个表单输入是否已填写,只要在输入字段元素上添加HTML5标记required即可: <input type="text" ...
- AngularJS表单验证实现方法详解
本文主要是通过源码实例和大家分享AngularJS中的表单验证相关知识,希望通过本文的分享,对大家学习AngularJS有所帮助. 1.常规表单验证: 2.AngularJs中提供的表单验证实例. 实 ...
- [Angularjs]表单验证
写在前面 在开发中提交表单,并对表单的值进行验证是非常常见的操作,angularjs对表单验证提供了非常好的支持. demo 表单 <form name="myform" n ...
随机推荐
- (linux)MMC 卡驱动分析
最近花时间研究了一下 MMC 卡驱动程序,开始在网上找了很多关于 MMC 卡驱动的分析文章,但大都是在描述各个层,这对于初学者来讲帮助并不大,所以我就打算把自己的理解写下来,希望对大家有用.个人觉得理 ...
- MYSQL初级学习笔记六:子查询!(视频序号:初级_42 | 43)
知识点八:子查询(42) 什么是子查询: 子查询是将一个查询语句嵌套在另一个查询语句中.内层查询语句的查询结果,可以作为外层查询语句提供条件. 引发子查询的情况: 使用[NOT] IN 的子查询 -- ...
- 使用PHP对word文档进行操作的方法
使用php时,因为加密等原因,如果直接用FILE后者OPEN等函数读取WORD的话往往是乱码,原来要使用COM 这是我简单的一个读取并存储到新的WORD上的文件<? // 建立一个指向新COM组 ...
- 基于HALCON的模板匹配方法总结 (转)
很早就想总结一下前段时间学习HALCON的心得,但由于其他的事情总是抽不出时间.去年有过一段时间的集中学习,做了许多的练习和实验,并对基于HDevelop的形状匹配算法的参数优化进行了研究,写了一篇& ...
- [SHOI 2009] 会场预约
[题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=2028 [算法] 直接用std :: set维护即可 时间复杂度 : O(NlogN) ...
- AJAX如何传递json对象给后端
如果页面上一直报错,根本没有触发异步请求的话,首先就要检查接口或者路径是否写对或者写全,在去考虑是否跨境的问题. 如果想要给后端传递一个json对象,需要在路径上一句添加content:applica ...
- 收集几个Android CalendarView非常用属性
android:dateTextAppearance 设置日历View在日历表格中的字体皮肤;android:firstDayOfWeek 指定日历第一个星期的第一天,在日历中横向所在位置,从右边向左 ...
- Ubuntu 16.04 如何使用Samba服务器
对于Windows与Ubuntu之间的数据传输,我们习惯于使用FTP工具,不过还是有学员问到samba服务器搭建和使用的问题,这便是本文的来由. Ubuntu版本:ARM裸机1期加强版配套的Ubunt ...
- 让ubuntu16.04开机进入命令行模式
使用Ubuntu时,有时候我们不想开机进入桌面,想直接进入命令行,这样启动的比较快, 1.首先我们修改grub文件,改为如图所示: sudo gedit /etc/default/grub 改完之后 ...
- linux中fork对打开文件的处理
1 子进程复制父进程的数据段.BBS段.代码段.堆空间.栈空间和文件描述符 2 对于文件描述符采用共享的方式 后面这个例子可以清晰的看出 #include <sys/types.h> #i ...