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 ...
随机推荐
- HDU2609 How many —— 最小表示法
题目链接:https://vjudge.net/problem/HDU-2609 How many Time Limit: 2000/1000 MS (Java/Others) Memory L ...
- 关于eclipse的resource文件没有发布到tomcat上的解决方案
版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/luman1991/article/details/53457302
- RxJava 参考文档
/*************************************************************** * RxJava 参考文档 * 说明: * 最近无意中发现RxJava ...
- Educational Codeforces Round 23
A题 分析:注意两个点之间的倍数差,若为偶数则为YES,否则为NO #include "iostream" #include "cstdio" #include ...
- 【前端】Nodejs给没有引号的json数据添加引号
转载请注明出处:http://www.cnblogs.com/shamoyuu/p/node_json.html 我们经常会遇到一些json数据需要放到json文件中,然后动态加载的场景. 但是也经常 ...
- CSS counter计数器(content目录序号自动递增)详解
一.CSS计数器三角关系 CSS计数器只能跟content属性在一起的时候才有作用,而content属性貌似专门用在before/after伪元素上的.于是,就有了,“计数器↔伪元素↔content属 ...
- HDU 1996 汉诺塔VI (排列组合)
题意:... 析:每次都是有三种放法,1,2,3,根柱子,所以就是3^n次方. 代码如下: #pragma comment(linker, "/STACK:1024000000,102400 ...
- UVa 1644 Prime Gap (水题,暴力)
题意:给定一个数 n,求它后一个素数和前一个素数差. 析:先打表,再二分查找. 代码如下: #pragma comment(linker, "/STACK:1024000000,102400 ...
- 洛谷 - P2730 - 魔板 Magic Squares - bfs
写状态转移弄了很久,老了,不记得自己的数组是怎么标号的了. #include <bits/stdc++.h> using namespace std; #define ll long lo ...
- C++开发工程师面试题库 1~50道
1. 指出以下变量数据存储位置 全局变量int(*g_pFun)(int);g_pFun=myFunction;g_pFun存储的位置(A ) 为全局的函数指针 指向空间的位置( B) 所有函数 ...