JS正则表达式验证表单
一.解释一些符号相关的意义
1. /^$/ 这个是个通用的格式。
^ 匹配输入字符串的开始位置;$匹配输入字符串的结束位置
2. 里面输入需要实现的功能。
* 匹配前面的子表达式零次或多次;
+ 匹配前面的子表达式一次或多次;
?匹配前面的子表达式零次或一次;
\d 匹配一个数字字符,等价于[0-9]
二、常用的表单验证代码
checkUserNameflag=false;
checkPasswordflag=false;
checkPasswordAgianflag=false;
checkEmailflag=false;
// 用户名校验
function checkUserName() {
var username = $("userNeme").value;
var zz = /^[A-Za-z0-9]{6,}$/;
if (!zz.test(username)) {
$("userName_warn").innerHTML = " × 用户名不符合规范";
checkUserNameflag=false;
} else {
/*$("userName_warn").style.color='blue';
$("userName_warn").innerHTML = "√ 用户名可用";*/
showUserExist(username);
checkUserNameflag=true;
}
} //重置提示
function resetWarn(){
$("userName_warn").innerHTML="";
$("email_warn").innerHTML="";
$("password_warn").innerHTML="";
$("Repassword_warn").innerHTML="";
}
// 密码校验
function checkPassword() {
var password1 = $("password").value;
if (password1.length >= 6 && password1.length <= 15) {
checkPasswordflag = true;
$("password_warn").style.color='blue';
$("password_warn").innerHTML = " √ 密码可用 ";
checkAgianMiMa();
} else {
checkPasswordflag = false;
$("password_warn").innerHTML = " × 密码至少为 6 个字符 ";
}
} function checkPasswordAgian() {
var password1 = $("password").value;
var password2 = $("rePassword").value;
if (password1 == password2) {
if (password1 == "") {
$("Repassword_warn").innerHTML = " × 请输入密码 ";
checkPasswordAgianflag = false;
return;
} $("Repassword_warn").style.color='blue';
$("Repassword_warn").innerHTML = "√ 重复输入密码正确";
checkPasswordAgianflag = true;
} else {
checkPasswordAgianflag = false;
$("Repassword_warn").innerHTML = " × 两次密码输入不同 "; }
} function checkEmail(){
//对电子邮件的验证
var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
var email=$("email").value;
if(!myreg.test(email)){
checkEmailflag=false;
$("email_warn").style.color='red';
$("email_warn").innerHTML = " × 邮箱格式不符合规范";
} else {
checkEmailflag=true;
$("email_warn").style.color='blue';
$("email_warn").innerHTML = "√ 邮箱格式正确";
}
} function submitCheck(){
alert(checkUserNameflag);
if(checkUserNameflag==false || checkPasswordflag==false || checkPasswordflag==false
||checkPasswordAgianflag==false || checkEmailflag==false){
return;
}
}
function $(id){
return document.getElementById(id);
}
JS正则表达式验证表单的更多相关文章
- JavaScript---通过正则表达式验证表单输入
验证输入的name只能是数字或字母或下划线 js <script type="text/javascript"> function submitOn(){ var f ...
- 饿了么组件库element-ui正则表达式验证表单,后端验证表单。
前言 老是遇到一些朋友问一些element-ui组件使用相关的基础问题,因为官方文档上并没有提供所有琐碎的功能代码demo.从这里开始我会根据我实际遇到的问题记录一些常见的官方文档没有详述的功能代码, ...
- js正则表达式处理表单
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...
- javascript 常用的正则表达式验证表单
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因
jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...
- jquery.validate验证表单
添加引用 <script src="/${appName}/commons/js/validate/jquery.validate.min.js"></scrip ...
- JS高级---案例:验证表单
案例:验证表单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- js验证表单大全
js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...
- js/jquery/插件表单验证
媳妇要学js,就收集一些资料给她. 1.js 表单验证 : http://hi.baidu.com/yanchao0901/item/161f563fb84ea5433075a1eb 2.jquery ...
随机推荐
- AOT
预 (AOT) 编译器 https://angular.cn/docs/ts/latest/cookbook/aot-compiler.html To run your app in AoT mode ...
- http://sofar.blog.51cto.com/353572/1540874
http://sofar.blog.51cto.com/353572/1540874 http://singlefly.blog.51cto.com/4658189/1368579 http://ww ...
- 李洪强漫谈iOS开发[C语言-019]-断点调试
- 10. 将摄像机对准物体,并显示整个对准过程,摄像机Zoom
1. 如果把代码放到按钮事件中调用,达不到想要的效果 2. 可以不用委托,但是要在Update函数中写调用CameraZoonIn的代码 3. 有很多需要改进的地方,可以参考使用 iTween 插件达 ...
- 坚果云创业团队访谈:我们 DIY 云存储(不要过度关注竞争对手,尤其当我们还是小公司的时候)
坚果云(http://jianguoyun.com/)是一款用于多平台文件同步.备份和交换的云存储工具,立志于提供“便捷,安全”的服务.坚果云自去年年初启动内测,至今年三月初刚刚正式发布.近日我们拜访 ...
- hdu4648Magic Pen 6
http://acm.hdu.edu.cn/showproblem.php?pid=4648 求连续的一段和对m取余为0 若s[j]和s[i]对M的余数都相同 则相见就满足要求 找个最长的 #inc ...
- bzoj2756
看到相邻格子都+1的操作一下就想到黑白染色了相邻格子都+1说明不管怎么弄,黑格子的总和和白格子总和的差总是定值这里首先要注意,最后不一定变成的是所有元素中的最大值,可能比它大比如 1 2 2 ...
- BZOJ_1625_ [Usaco2007_Dec]_宝石手镯_(01背包)
描述 http://www.lydsy.com/JudgeOnline/problem.php?id=1625 01背包裸题. p.s.随便点开一道就是水题... 分析 ... #include &l ...
- BZOJ_2179_FFT快速傅立叶_(FFT)
描述 http://www.lydsy.com/JudgeOnline/problem.php?id=2179 超大整数乘法 分析 FFT模板题. 把数字看成是多项式,x是10.然后用FFT做多项式乘 ...
- Memcached‘process_bin_delete’函数安全漏洞
漏洞名称: Memcached‘process_bin_delete’函数安全漏洞 CNNVD编号: CNNVD-201401-174 发布时间: 2014-01-15 更新时间: 2014-01-1 ...