JQuery注册页⾯表单检验完善</html><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册页⾯</title>
<script type="text/javascript" src="../js/jquery-1.8.3.js" ></script>
<script type="text/javascript" src="../js/jquery.validate.min.js" ></script>
<script type="text/javascript" src="../js/messages_zh.js" ></script>
<style>
<{
color:red;
}
label.sucess{
padding-left:20px;
background: url(../img/register.gif) no-repeat 10px 2px;
}
</style>
<script>
$(function(){
$("#formCheck").validate({
rules:{
user:{
required:true,
minlength:6
},
password:{
required:true,
digits:true,
minlength:6
},
email:{
required:true,
email:true
},
username:{
required:true,
maxlength:5
},
sex:{
required:true
}
},
messages:{
user:{
required:"⽤户名不能为空",
minlength:"⽤户名不能少于6"
},
password:{
required:"密码不能为空",
digits:"密码必须为数字",
minlength:"密码不能少于六位"
},
email:{jquery怎么进行验证
required:"邮箱必填",
email:"邮箱格式不正确"
},
username:{
required:"姓名必填",
maxlength:"不能多于5位"
},
sex:{
required:"性别必须勾选"
}
}
//    errorElement:"label",
//    success:function(label){
/
/    (" ").addClass("success");
//    }
});
});
</script>
<script>
$(function(){
//1 创建数组保存对应的城市
var city = new Array(3);
city[0]=new Array("武汉","黄冈","襄阳");
<body>
<table border="1px" align="center" width="1300px" cellpadding="0px" cellspacing="0px">
<!--1.logo部分-->
<tr>
<td>
<!--嵌套⼀个⼀⾏三列的表格-->
<table border="1px" width="100%">
<tr height="50px">
<td width="33.3%">
<img src="../img/logo2.jpg" height="47px" />
</td>
<td width="33.3%">
<img src="../img/header.png" height="47px" />
</td>
<td width="33.3%">
<a href="#">登录</a>
<a href="#">注册</a>
<a href="#">购物车</a>
</td>
</tr>
</table>
</td>
</tr>
<!--2.导航栏部分-->
<tr height="50px">
<td bgcolor="black">
    
<a href="#">
<font size="5" color="white">⾸页</font>
</a>     
<a href="#">
<font color="white">⼿机数码</font>
</a>    
<a href="#">
<font color="white">电脑办公</font>
</a>    
<a href="#">
<font color="white">鞋靴箱包</font>
</a>    
<a href="#">
<font color="white">家⽤电器</font>
</a>
</td>
</tr>
<!--3.注册表单-->
<tr>
<td height="600px" background="../img/regist_bg.jpg">
<!--嵌套⼀个⼗⾏⼆列的表格-->
<form action="#" id="formCheck" method="get" name="regForm" onsubmit="return checkForm()">
<table border="1px" width="750px" height="400px" align="center" cellpadding="0px" cellspacing="0px" bgcolor="white">
<tr height="40px">
<td colspan="2">
<font size="4">会员注册</font>    USER REGISTER
</td>
</tr>
<tr>
<td width="80px">
⽤户名
</td>
<td>
<input type="text" name="user" size="34px" id="user" onfocus="showTips('user','⽤户名必填')"<span id="userspan"></span> </td>
</tr>
<tr>
<td>
密码
</td>
<td>
<input type="password" name="password" size="34px" id="password" /><span id="passwordspan"></span>
</td>
</tr>
<tr>
<td>
确认密码
</td>
<td>
<input type="password" name="repassword" size="34px" id="repassword"></input>
</td>
</tr>
<tr>
<td>
<input type="text" name="email" size="34px" id="eamil"/> </td>
</tr>
<tr>
<td>
姓名
</td>
<td>
<input type="text" name="username" size="34px"/>
</td>
</tr>
<tr>
<td>籍贯</td>
<td>
<select id="province">
<option>===请选择===</option>
<option value="">湖北</option>
<option value="">湖南</option>
<option value="">河北</option>
<option value="">河南</option>
</select>
<select id="city">
</select>
</td>
</tr>
<tr>
<td>
性别
</td>
<td>
<input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="⼥"/>⼥
</td>
</tr>
<tr>
<td>
出⽣⽇期
</td>
<td>
<input type="text" name="birthday" size="34px"/>
</td>
</tr>
<tr>
<td>
验证码
</td>
<td>
<input type="text" name="yzm" />
<img src="../img/yanzhengma.png" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="注册" />
</td>
</tr>
</table>
</form>
</td>
</tr>
<!--4.⼴告图⽚-->
<tr>
<td>
<img src="../img/footer.jpg" width="100%"/>
</td>
</tr>
<!--5.友情链接和版权信息-->
<tr>
<td align="center">
<a href="#">关于我们</a>
<a href="#"></a>
<a href="#">招贤纳⼠</a>
<a href="#">法律声明</a>
<a href="#">友情链接</a>
<a href="#">⽀付⽅式</a>
<a href="#">配送⽅式</a>
<a href="#">服务声明</a>
<a href="#">⼴告声明</a>
<p>
Copyright © 2016-2018 xx商城版权所有
</table> </body> </html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。