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 ...
随机推荐
- jQuery.Validate自定义规程的使用案例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- php smarty section使用
文件:section.tpl <html> <head> <title></title> </head> <body> {sec ...
- code forces Watermelon
/* * Watermelon.cpp * * Created on: 2013-10-8 * Author: wangzhu */ /** * 若n是偶数,且大于2,则输出YES, * 否则输出NO ...
- SPRING IN ACTION 第4版笔记-第四章ASPECT-ORIENTED SPRING-009-带参数的ADVICE2
一. 情景:有个魔术师会读心术,常人一想一事物他就能读到.以魔术师为切面织入常人的内心. 二. 1. // <start id="mindreader_java" /> ...
- 对于Unicode编码在js中和html中
1.对于Unicode在js中 var a="\u9102WQW121" 中"\"是需要转义的,直接在页面输出的效果
- Android WebView 开发详解(一)
转载请注明出处 http://blog.csdn.net/typename/article/details/39030091 powered by meichal zhao 概览: Android ...
- Android 设置控件可见与不可见
通常控件的可见与不可见分为三种情况 第一种 gone 表示不可见并且不占用空间 第二种 visible 表示可见 第三种 invisible 表示不 ...
- 【HDOJ】1263 水果
hash,使用stl map ac.学了find_if等强大的东西,第一次使用stl模板. #include <iostream> #include <cstdio> #inc ...
- Service Oriented Architecture
What is Service Oriented Architecture (SOA)? There have been so many interpretations of this through ...
- bzoj1069
四边形的问题可以转化为三角形处理穷举对角线,然后处理上下两个三角形,旋转卡壳 ..] of double; q:..] of longint; l,r,i,j,k,t,n:longint; ans:d ...