用户注册jquery验证

来源：互联网发布：mac唇釉价格编辑：程序博客网时间：2024/05/17 07:13

<!------------------------------------js

      // 如果是密码框
      if (inputType == "passWord") {
       var vill = false;
       if (val == "") {
        $("#" + inputType + "_msg").text("密码不允许为空");
        vill = false;
        villPassWordResult=false;
       } else {
        var v = /^[\@A-Za-z0-9\!\#\$\%\^\&\*\.\~]{6,22}$/.test(val);
        if (!v) {
         $("#" + inputType + "_msg").text("密码可以为全数字,全字母3,全特殊字符(~!@#$%^&*.),上述三种的组合，长度为6-22");
         vill = false;
         villPassWordResult=false;
        }else{
         vill=true;
        }
       }
       if(vill==true){
        $("#" + inputType + "_msg").text("密码可用");
        villPassWordResult=true;
       }
      }


      //如果是重复密码框
      if(inputType=="cfPassWord"){
       var vill = false;
       if (val == "") {
        $("#" + inputType + "_msg").text("请再一次输入密码");
        vill = false;
        villCfPassWordResult=false;
       }else{
        if(val!=$("#passWord").val()){
         $("#" + inputType + "_msg").text("两次输入密码不正确");
         vill = false;
         villCfPassWordResult=false;
        }else{
         vill=true;
        }
       }
       if(vill==true){
        $("#" + inputType + "_msg").text("密码可用");
        villCfPassWordResult=true;
       }
      }

      //如果是邮箱框
      if(inputType=="email"){
       var vill = false;
       if (val == "") {
        $("#" + inputType + "_msg").text("邮箱不允许为空");
        vill = false;
        villEmailResult=false;
       }else{
        var v=/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(val);
        if(!v){
         $("#" + inputType + "_msg").text("邮箱格式不正确");
         vill = false;
         villEmailResult=false;
        }else{
         vill=true;
        }
       }
       if(vill==true){
        $("#" + inputType + "_msg").text("邮箱可用");
        villEmailResult=true;
       }
      }

     });

$("#subBtu").click(function(){
  if(villUserNameResult && villPassWordResult && villCfPassWordResult && villEmailResult){
   alert("数据通过");
  }else{
   alert("数据不合法");
  }
});

});

<!--------------------------------html

<%@ page language="java" contentType="text/html; charset=GBK"
pageEncoding="GBK"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="../js/register.js?rnd=1306000" charset="UTF-8"></script>
<style type="text/css">
body{margin: 0;padding: 0px;text-align: center;}
#main{width: 700px;border: solid 1px #ccc; text-align: center;margin: o auto;margin-top: 150px;}
#main table{width: 75%;margin: 0 auto;border: solid 1px #ccc;font-size: 12px;}
#main table td{border: solid 1px #ccc; margin: 0px;padding: 0px;}
.input_msg{font-size: 12px;color: #ccc;}
#main table td span{font-size: 12px;color: #ccc;text-align: left;}
#messageDiv{position: absolute;width: 300px;height: 100px;border: solid 1px #ccc;left: 550px;top: 0px;}
</style>

</head>
<body>
<div id="main">
<table>
<col width="40%;"/><col width="40%;"/><col width="20%;"/>
<tr>
  <td>用户名：</td>
  <td><input id="userName" title="请输入用户名" class="input_msg"/></td>
  <td><span id="userName_msg"></span> </td>
</tr>
<tr>
  <td>密码：</td>
  <td><input id="passWord" title="请输入密码" class="input_msg"/></td>
  <td><span id="passWord_msg"></span> </td>
</tr>
<tr>
  <td>重复密码：</td>
  <td><input id="cfPassWord" title="请再一次输入密码" class="input_msg"/></td>
  <td><span id="cfPassWord_msg"></span> </td>
</tr>
<tr>
  <td>邮箱：</td>
  <td><input id="email" title="请输入邮箱" class="input_msg"/></td>
  <td><span id="email_msg"></span> </td>
</tr>

<tr>
<td colspan="2">
  <input type="submit" value="submit" id="subBtu"/>
</td>

</tr>

</table>

</div>

</body>
</html>