一、用户注册与验证（JavaScript）
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function check(){
var user = document.form1.userId.value;
var pass = document.form1.password1.value;
var rePass = document.form1.password2.value;
var email=form1.email.value;
var tel1=form1.tel1.value;
var tel2=form1.tel2.value;
var age=form1.age.value;
if(parseInt(user)>0) {
alert("不能全为数字");
form1.userId.focus();
return false;}
if(user.length > 16 || user.length < 4){
alert("账号长度必须大于等于4,小于等于16");
form1.userId.focus();
return false;
}else if(isFirst()){
alert("账号头字母不能为数字");
form1.userId.focus();
return false;
}else if(isSpace()){
alert("账号只能包含字母,数字,下划线‘_‘!");
form1.userId.focus();
return false;
}
else if(pass.length < 1){
alert("请输入密码");
form1.password1.focus();
return false;
}else if(pass != rePass){
alert("两次密码输入不相符合!");
form1.password2.focus();
return false;
} else if(email.indexOf(‘@‘)<1){
alert("邮箱格式不对！！");
form1.email.focus();
return false;
}else if(isNaN(age))
{
alert(‘请输入数字!‘);
form1.age.focus();
return false;
}
return true;
}
function isSpace(){
var name = document.form1.userId.value.split(" ");
for(i= 0;i<name.length;i++){
if(name[i]==""){
return true;
}else if( !((name[i]<"z" && name[i] >"a")||(name[i] <"Z"&&name[i]>"A")
||name[i] =="_"||(name[i]< "9" && name[i]>"0"))){
return true;
}
}
return false;
}
function isFirst(){
var name = document.form1.userId.value.split("");
if(name[0] < "9" && name[0] > "0"){
return true;
}
return false;
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" onSubmit="return check();" action="doReg.jsp">
<table border="0" class="fontstyle">
<tr>
<td colspan="3"><h2>用户注册</h2><hr></td>
</tr>
<tr>
<td width=69>账 号*：</td>
<td width="197"><input name="userId" type="text" id="userId" size="20" onFocus=""/></td>
<td width="220">4-16个字符，由字母或数字、下划线，首字母不能为数字，不可全为数字</td>
</tr>
<tr>
<td>密 码*：</td>
<td><input name="password1" type="text" id="password1" size="20" /></td>
<td>4-16个字符，由字母或数字，不可全为数字</td>
</tr>
<tr>
<td >确认密码*：</td>
<td><input name="password2" type="text" id="password2" size="20" /></td>
<td> </td>
</tr>
<tr>
<td>呢 称：</td>
<td><input name="name" type="text" id="name" size="20" /></td>
<td>4-20个字符，由字母、数字和下划线组成（可中文），不可全为数字</td>
</tr>
<tr>
<td>性 别：</td>
<td><input name="sex" type="radio" value="男" checked="checked" />
男
<input type="radio" name="sex" value="女" />
女</td>
<td> </td>
</tr>
<tr>
<td>年 龄：</td>
<td><label for="age"></label>
<input name="age" type="text" id="age" size="3" maxlength="3" /></td>
<td>16-100岁</td>
</tr>
<tr>
<td>喜欢商品：</td>
<td><input class="size" type="checkbox" name="aihao" value="图书" />
图书
<input type="checkbox" name="aihao" value="电子产品" />
电子产品
<input type="checkbox" name="aihao" value="衣服" />
衣服
<br/>
<input type="checkbox" name="aihao" value="箱包" />
箱包
<input type="checkbox" name="aihao" value="饰品"/>
饰品</td>
<td> </td>
</tr>
<tr>
<td>邮 箱*：</td>
<td><input name="email" type="text" id="email" size="20" /></td>
<td>格式如XX@sina.com</td>
</tr>
<tr>
<td>手 机*：</td>
<td><input name="tel1" type="text" id="tel1" size="20" /></td>
<td>格式如13562276780</td>
</tr>
<tr>
<td>办公电话：</td>
<td><input name="tel2" type="text" id="tel2" size="20" /></td>
<td>格式如0546-8083321</td>
</tr>
<tr>
<td> </td>
<td><input type="submit" name="submit" id="submit" value="提交" />
<input type="reset" name="reset" id="reset" value="重置" /></td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
二、正则表达式验证
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript" type="text/javascript" >
function checkyhm(){
var Checkyhm =/^[a-zA-Z]\w{5,17}$/;
var txtyhm = document.zhuce.yhm.value;
if(!Checkyhm.test(txtyhm)){
alert("注册帐号只能以字母开头，长度在6-18之间，只能包含字符、数字和下划线！");
document.zhuce.yhm.focus();
return false;
}
}
function checkdlmm(){
var Checkdlmm =/^[A-Za-z0-9]{6,20}$/;
var txtdlmm = document.zhuce.dlmm.value;
if(!Checkdlmm.test(txtdlmm)){
alert("登录密码只能是6-20位英文字母或者数字或下划线，建议采用易记的英文数字组合！");
document.zhuce.dlmm.focus();
return false;
}
}
function checkqrmm(){
if ( document.zhuce.qrmm.value != document.zhuce.dlmm.value) {
//如果登录密码与确认密码不一致，则弹出警告对话框
alert("登录密码与确认密码不一致！");
document.zhuce.qrmm.focus();
return false;
}
}
function checkyxdz(){
var Checkyxdz =/^(?:\w+\.?)*\w+@(?:\w+\.)+\w+$/;
var txtyxdz = document.zhuce.yxdz.value;
if(!Checkyxdz.test(txtyxdz)){
alert("邮箱地址格式不正确！");
document.zhuce.yxdz.focus();
return false;
}
}
</script>
</head>
<body>
</body>
</html>
三、存储到数据库
四、用户登陆（数据库访问）
五、管理界面UI
本文出自 “学而不思则罔” 博客，请务必保留此出处http://dyzyxy.blog.51cto.com/944775/1643812
原文地址：http://dyzyxy.blog.51cto.com/944775/1643812
