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 ...
随机推荐
- 10个基于 Ruby on Rails 构建的顶级站点
本文系国内 ITOM 行业领军企业 OneAPM 工程师翻译整理自 Raviraj Hegde 的文章 Top Sites Built with Ruby on Rails. 就其本身而言,Ruby ...
- 服务器部署_linuix下 一台nginx 多域名之二
第二个需求: 1. 一台服务器部署了三个应用web1~web3对应三个域名:www.web1.com.www.web2.com.www.web3.com ,方法参照我另外一篇文章 2. 如果用非www ...
- linux-0.11内核 任务的堆栈切换
http://blog.163.com/di_yang@yeah/blog/static/86118492201212534924900/ 一直缠绕的两个问题:怎样标识的内核栈与用户栈?如何在内核态堆 ...
- 【HDOJ】2045 不容易系列之(3)—— LELE的RPG难题
着色问题,递推,当超过3个块时,规律明显,此时可以是n-2的头尾重复+与头尾不同颜色,也可以是n-1+与头尾均不相同眼色情况.经典递推.注意long long. #include <stdio. ...
- tlplayer for android V2.7(支持变速不变调) 2014-07-20更新
2014-07-20新版本已经修复部分视频倾斜问题,已经更新到服务器,需要的朋友自行下载. 此版本修正了倾斜问题,增加水印等功能.可以动态添加水印. tlplayer for android V2.6 ...
- 机器学习&深度学习经典资料汇总,data.gov.uk大量公开数据
<Brief History of Machine Learning> 介绍:这是一篇介绍机器学习历史的文章,介绍很全面,从感知机.神经网络.决策树.SVM.Adaboost到随机森林.D ...
- ArrayList Iterator remove java.lang.UnsupportedOperationException
在使用Arrays.asList()后调用add,remove这些method时出现 java.lang.UnsupportedOperationException异常.这是由于Arrays.asLi ...
- 六月计划#1A(6.1-6.8)
5/35 数学 BZOJ_[HNOI2008]_Cards_(置换+Burnside引理+乘法逆元+费马小定理+快速幂) BZOJ_1005_ [HNOI2008]_明明的烦恼_(组合数学+purfe ...
- poj 1167 简单搜索
这题主要是注意好限定的条件 条件1:每个公交车都至少要到达两次 条件2:公交车相同时间和相同间隔是属于两种车辆 条件3:不同的车可能到达时间相同 上述都是深搜的重要条件: #include<al ...
- POJ 2406
思路:由于题目要求的是最大值,因此从n开始向下查找,第一次出现的满足条件的那个数就是最大的,查找就可以结束,如果查找到1是仍未找到合适的值,则为1,就是说不是任何字符串的次方如abcd #includ ...