正则表达式及js校验表单代码（注册页面）

来源：互联网发布：街机赛马源码编辑：程序博客网时间：2024/05/12 20:47

正则表达式

位置：

^ 开头

$ 结尾

次数：

* 0或多个

+ 1或多个

? 0或1个

{n} 就是n个

{n,} 至少n个

{n,m} 最少n个，最多m个

通配符：

\d 任意数字

\D 任意非数字

\s 任意空白

\S 任意非空白

. 任意字符（除'\n'外）

组合：

[a-z]

[0-9]

等

组：

(正则) 匹配括号中正则表达式对应的结果，并暂存这个结果。

(?:正则) 匹配括号中正则表达式对应的结果，但不暂存这个结果。

\数字使用第n个组匹配的结果

使用正则的工具（RegExp类与相关方法）

创建：

// 方式一

var regex = new RegExp("正则表达式", "标志");

// 方式二

var regex = /正则表达式/标志

参数说明：

正则表达式：

参见上面的规则

标志：

g （全文查找出现的所有 pattern）

i （忽略大小写）

m （多行查找）

方法：

Regexp.test( str )

String.replace( regex, str )

校验表单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

//用户名的规则：第一位是字母，只有由数字与字母组成，6位。

function checkName(){

//获取到了用户名的值

var userName = document.getElementById("username").value;

var userSpan = document.getElementById("userId");

var reg = /^[a-z][a-z0-9]{5}$/i;

if(reg.test(userName)){

//符合规则

userSpan.innerHTML="正确".fontcolor("green");

return true;

}else{

//不符合规则

userSpan.innerHTML="错误".fontcolor("red");

return false;

}

//校验密码 6位

function checkPass(){

var password = document.getElementById("pwd").value;

if(password.length>0){

var reg = /^\w{6}$/;

var passSPan = document.getElementById("passId");

if(reg.test(password)){

//符合规则

passSPan.innerHTML="正确".fontcolor("green");

return true;

}else{

//不符合规则

passSPan.innerHTML="错误".fontcolor("red");

return false;

}

//检验密码是否正确

function ensurepass(){

var password1 = document.getElementById("pwd").value; //第一次输入的密码

var password2 = document.getElementById("ensurepwd").value;

if(password2.length>0){

var enSpan = document.getElementById("ensure");

if(password1.valueOf()==password2.valueOf()){

enSpan.innerHTML="正确".fontcolor("green");

return true;

}else{

enSpan.innerHTML="错误".fontcolor("red");

return false;

}

//校验邮箱

function checkEmail(){

var email = document.getElementById("email").value;

var reg = /^[a-z0-9]\w+@[a-z0-9]{2,3}(\.[a-z]{2,3}){1,2}$/i; // .com .com.cn

var emailspan = document.getElementById("emailspan");

alert(reg.test(email));

if(reg.test(email)){

//符合规则

emailspan.innerHTML="正确".fontcolor("green");

return true;

}else{

//不符合规则

emailspan.innerHTML="错误".fontcolor("red");

return false;

}

//校验兴趣爱好：至少要算中其中的一个。

function checkHoby(){

var likes = document.getElementsByName("like");

var hobySpan =document.getElementById("hobbySpan")

var flag = false;

for(var i = 0 ; i<likes.length ; i++){

if(likes[i].checked){

flag =true;

break;

}

if(flag){

//符合规则

hobySpan.innerHTML="正确".fontcolor("green");

return true;

}else{

//不符合规则

hobySpan.innerHTML="错误".fontcolor("red");

return false;

}

//总体校验表单是否可以提交了如果返回的true表单才可以提交。上面的表单项必须要每个都填写正确。

function checkForm(){

var userName = checkName();

var pass = checkPass();

var ensure = ensurepass();

var email = checkEmail();

var hoby = checkHoby();

if(userName&&pass&&ensure&&email&&hoby){

return true;

}else{

return false;

}

</script>

<title>正则表达式</title>

</head>

<body>

<tr>

<td>

</td>

</tr>

<tr>

</td>

</tr>

<tr>

</td>

</tr>

<tr>

</td>

</tr>

<tr>

男

女</td>

</tr>

<tr>

eat

sleep

play

</td>

</tr>

<tr>

</select>

</td>

</tr>

<tr>

</tr>

</td>

</tr>

</table>

</form>

</body>

</html>

0 0