表单的各正则验证[JS、JQuer…

来源：互联网发布：世界上第一个软件编辑：程序博客网时间：2024/06/05 10:01

原文地址：表单的各正则验证[JS、JQuery用法]作者：邓强

用户名称：用户密码：

下面的代码是主体的部分示范代码，其它部分格式跟其都一样，只需要修改onblur=""、onfocus=""，中的方法名，"<input>"标签中的name值、id值，"以及"span"标签中的id名。

<html>

<head>

</head>

<body>

<table>

<tr>

<tdwidth="60%">

</td>

</tr>

<tr>

</tr>

</table>

</form>

</body>

</html>

以下是JS、JQuery的验证代码

// 验证用户名

function ckname(){

varusername=$("#username").val();

varrename=/^w{5,12}$/;

if(username==""){

$("#susername").html("用户名不能为空").css("color","red");

return false;

}elseif(!rename.test(username)){

$("#susername").html("用户为5-12位字符").css("color","red");

return false;

}else{

$("#susername").html("用户名正确").css("color","green");

}

function ckname1(){

$("#susername").html("请输入5-12位字符").css("color","red");

}

// 密码验证

function ckpassword(){

varpassword=$("#password").val();

var repass=/^w{6,18}$/;

if(password==""){

$("#spassword").html("密码不能为空").css("color","red");

returnfalse;

}elseif(!repass.test(password)){

$("#spassword").html("密码为6-12位字符").css("color","red");

returnfalse;

}else{

$("#spassword").html("密码正确").css("color","green");

}

// 确认密码的验证

function ckpassword1(){

var password=$("#password").val();

varpassword1=$("#password1").val();

if(password1==""){

$("#spassword1").html("验证密码不能为空").css("color","red");

return false;

}elseif(password1!=password){

$("#spassword1").html("两次密码不相同").css("color","red");

return false;

}else{

$("#spassword1").html("密码确认正确").css("color","green");

}

// 邮箱验证

function ckemail(){

varemail=$("#email").val();

varreemail=/^w+@w+(.w+)+$/;

if(email==""){

$("#semail").html("邮箱不能为空").css("color","red");

returnfalse;

}elseif(!reemail.test(email)){

$("#semail").html("邮箱格式不正确").css("color","red");

returnfalse;

}else{

$("#semail").html("邮箱正确").css("color","green");

}

// 电话验证

function ckphone(){

varphone=$("#phone").val();

varrephone=/^1[3578]d{9}$/;

if(phone==""){

$("#sphone").html("电话不能为空").css("color","red");

return false;

}elseif(!rephone.test(phone)){

$("#sphone").html("电话格式不正确").css("color","red");

return false;

}else{

$("#sphone").html("电话正确").css("color","green");

}

// 简介验证

function ckdesc(){

vardesc=$("#desc").val();

if(desc==""){

$("#sdesc").html("简介不能为空").css("color","red");

return false;

}else{

$("#sdesc").html("简介格式正确").css("color","green");

}

// 总验证

function ckfun(){ if(ckname()==false||ckpassword()==false||ckpassword1()==false||ckemail==false||ckphone()==false||ckdesc()==false){

alert("验证有误");

returnfalse;

}else{

alert("验证通过");

}

0 0