bbs用户注册页面源码
2015-09-17 19:08
471 查看
<!DOCTYPE html>
<html>
<head>
<title>register.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<style>
div{color:#F00; font-size:12px;}
</style>
<script type="text/javascript">
//清除错误信息
function clearError(eid){
document.getElementById(eid).innerHTML="";}
/*document.getElementById("username").innerHTML="用户名不能为空！";
return false;
}*/
//显示错误信息
function showError(eid,msg){
document.getElementById(eid).innerHTML=msg;
}
//验证用户名
function checkUsername(){
//获取输入值
var username= document.getElementById("username").value;
//1是否为空
if(username.length==0){
var msg="用户名不能为空！";
showError('nameerror',msg);
return false;
}
//2格式是否正确（要求开头是字母，其余可以是字母数字，下划线，长度6-20位）
var pattern=/^[a-zA-Z][a-zA-Z0-9_]{5,9}$/;
if(pattern.test(username)==false){
var msg="用户名格式非法";
showError('nameerror',msg);
return false;
}
return true;
}
function checkemail(){
var email = document.getElementById("email").value;
if(email.length==0){
var msg ="邮箱不能为空！";
showError('emailerror',msg);
return false;
}
var pattern = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;
if(pattern.test(email)==false){
var msg ="邮箱格式不正确!";
showError('emailerror',msg);
return false;
}
return true;
}
function checkpassword(){
var password = document.getElementById("password").value;
if(password.length==0){
var msg ="密码不能为空！";
showError('passworderror',msg);
return false;
}
return true;
}
function checkpassword2(){
var password2 = document.getElementById("password2").value;
var password= document.getElementById("password").value;
if(password2.length==0){
var msg ="确认密码不能为空！";
showError('password2error',msg);
return false;
}
if(!(password==password2)){
var msg ="密码不一致!";
showError('password2error',msg);
return false;
}
return true;
}
function checkqq(){
var qq = document.getElementById("qq").value;
if(qq.length==0){
var msg ="qq不能为空！";
showError('qqerror',msg);
return false;
}
var pattern=/^[1-9][0-9]{4,9}$/;
if(pattern.test(qq)==false){
var msg ="qq格式非法!";
showError('qqerror',msg);
return false;
}
return true;
}
//对提交按钮整体验证
function checkinput(){
if(checkusername()==true&&checkqq()==true&&checkemail()==true&&checkpassword()==true){
return true;
}else{
alert("请按照提示输入");
return false;
}
}
</script>
</head>
<body>
<form name="form1" method="post" action="user.do">
<table width="700" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="4" align="center">BBS用户注册</td>
</tr>
<tr>
<td width="108">用户名：</td>
<td width="402"><label for="textfield"></label>
<input type="text" name="username" id="username" onBlur="checkUsername();" onFocus="clearError('nameerror');"></td>
<td width="279"> <div id="nameerror"> </div>
</td> <td width="108"> </td>
</tr>
<tr>
<td>密码：</td>
<td><label for="textfield2"></label>
<input type="password" name="password" id="password" onBlur="checkpassword()" onFocus="clearError('passworderror')" >
</td>
<td> <div id="passworderror"></td>
<td width="108"> </td>
</tr>
<tr>
<td>确认密码：</td>
<td><label for="textfield3"></label>
<input type="password" name="password2" id="password2" onBlur="checkpassword2()" onFocus="clearError('password2error')" >
</td>
<td> <div id="password2error"></td><td width="108"> </td>
</tr>
<tr>
<td height="41">性别：</td>
<td><input type="radio" name="sex" id="radio" value="男">
<label for="radio">男
<input type="radio" name="sex" id="radio2" value="女">
女</label></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td height="29">个人爱好：</td>
<td><p>
<label>
</label>
<label>
</label>
<input type="checkbox" name="hobby" id="hobby" value=" 文学">
<label for="checkbox"></label>
文学
<input type="checkbox" name="hobby" id="hobby" value="运动 ">
<label for="checkbox2"></label>
运动
<input type="checkbox" name="hobby" id="hobby" value="读书">
<label for="checkbox3"></label>
读书<br>
</p></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>出生日期：</td>
<td><label for="select"></label>
<select name="year" id="select">
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
</select>
年</td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>所在城市：</td>
<td><label for="select2"></label>
<select name="city" id="city">
<option value="济南">济南</option>
<option value="临沂">临沂</option>
<option value="济宁">济宁</option>
<option value="日照">日照</option> <option value="潍坊">潍坊</option>
</select></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>电子邮件：</td>
<td><label for="textfield2"></label>
<input type="text" name="email" id="email" onBlur="checkemail()" onFocus="clearError('emailerror')" ></td>
<td><div id="emailerror"></td>
<td width="108"> </td>
</tr>
<tr>
<td>QQ：</td>
<td><label for="textfield3"></label>
<input type="text" name="qq" id="qq" onBlur="checkqq()" onFocus="clearError('qqerror')"></td>
<td><div id="qqerror"> </td>
<td width="108"> </td>
</tr>
<tr>
<td colspan="4" align="center"><input type="submit" name="button" id="button" value="提交">
<input type="submit" name="button2" id="button2" value="重置"></td>
</tr>
</table>
</form>
<br>
</body>
</html>
<html>
<head>
<title>register.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<style>
div{color:#F00; font-size:12px;}
</style>
<script type="text/javascript">
//清除错误信息
function clearError(eid){
document.getElementById(eid).innerHTML="";}
/*document.getElementById("username").innerHTML="用户名不能为空！";
return false;
}*/
//显示错误信息
function showError(eid,msg){
document.getElementById(eid).innerHTML=msg;
}
//验证用户名
function checkUsername(){
//获取输入值
var username= document.getElementById("username").value;
//1是否为空
if(username.length==0){
var msg="用户名不能为空！";
showError('nameerror',msg);
return false;
}
//2格式是否正确（要求开头是字母，其余可以是字母数字，下划线，长度6-20位）
var pattern=/^[a-zA-Z][a-zA-Z0-9_]{5,9}$/;
if(pattern.test(username)==false){
var msg="用户名格式非法";
showError('nameerror',msg);
return false;
}
return true;
}
function checkemail(){
var email = document.getElementById("email").value;
if(email.length==0){
var msg ="邮箱不能为空！";
showError('emailerror',msg);
return false;
}
var pattern = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;
if(pattern.test(email)==false){
var msg ="邮箱格式不正确!";
showError('emailerror',msg);
return false;
}
return true;
}
function checkpassword(){
var password = document.getElementById("password").value;
if(password.length==0){
var msg ="密码不能为空！";
showError('passworderror',msg);
return false;
}
return true;
}
function checkpassword2(){
var password2 = document.getElementById("password2").value;
var password= document.getElementById("password").value;
if(password2.length==0){
var msg ="确认密码不能为空！";
showError('password2error',msg);
return false;
}
if(!(password==password2)){
var msg ="密码不一致!";
showError('password2error',msg);
return false;
}
return true;
}
function checkqq(){
var qq = document.getElementById("qq").value;
if(qq.length==0){
var msg ="qq不能为空！";
showError('qqerror',msg);
return false;
}
var pattern=/^[1-9][0-9]{4,9}$/;
if(pattern.test(qq)==false){
var msg ="qq格式非法!";
showError('qqerror',msg);
return false;
}
return true;
}
//对提交按钮整体验证
function checkinput(){
if(checkusername()==true&&checkqq()==true&&checkemail()==true&&checkpassword()==true){
return true;
}else{
alert("请按照提示输入");
return false;
}
}
</script>
</head>
<body>
<form name="form1" method="post" action="user.do">
<table width="700" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="4" align="center">BBS用户注册</td>
</tr>
<tr>
<td width="108">用户名：</td>
<td width="402"><label for="textfield"></label>
<input type="text" name="username" id="username" onBlur="checkUsername();" onFocus="clearError('nameerror');"></td>
<td width="279"> <div id="nameerror"> </div>
</td> <td width="108"> </td>
</tr>
<tr>
<td>密码：</td>
<td><label for="textfield2"></label>
<input type="password" name="password" id="password" onBlur="checkpassword()" onFocus="clearError('passworderror')" >
</td>
<td> <div id="passworderror"></td>
<td width="108"> </td>
</tr>
<tr>
<td>确认密码：</td>
<td><label for="textfield3"></label>
<input type="password" name="password2" id="password2" onBlur="checkpassword2()" onFocus="clearError('password2error')" >
</td>
<td> <div id="password2error"></td><td width="108"> </td>
</tr>
<tr>
<td height="41">性别：</td>
<td><input type="radio" name="sex" id="radio" value="男">
<label for="radio">男
<input type="radio" name="sex" id="radio2" value="女">
女</label></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td height="29">个人爱好：</td>
<td><p>
<label>
</label>
<label>
</label>
<input type="checkbox" name="hobby" id="hobby" value=" 文学">
<label for="checkbox"></label>
文学
<input type="checkbox" name="hobby" id="hobby" value="运动 ">
<label for="checkbox2"></label>
运动
<input type="checkbox" name="hobby" id="hobby" value="读书">
<label for="checkbox3"></label>
读书<br>
</p></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>出生日期：</td>
<td><label for="select"></label>
<select name="year" id="select">
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
</select>
年</td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>所在城市：</td>
<td><label for="select2"></label>
<select name="city" id="city">
<option value="济南">济南</option>
<option value="临沂">临沂</option>
<option value="济宁">济宁</option>
<option value="日照">日照</option> <option value="潍坊">潍坊</option>
</select></td>
<td> </td>
<td width="108"> </td>
</tr>
<tr>
<td>电子邮件：</td>
<td><label for="textfield2"></label>
<input type="text" name="email" id="email" onBlur="checkemail()" onFocus="clearError('emailerror')" ></td>
<td><div id="emailerror"></td>
<td width="108"> </td>
</tr>
<tr>
<td>QQ：</td>
<td><label for="textfield3"></label>
<input type="text" name="qq" id="qq" onBlur="checkqq()" onFocus="clearError('qqerror')"></td>
<td><div id="qqerror"> </td>
<td width="108"> </td>
</tr>
<tr>
<td colspan="4" align="center"><input type="submit" name="button" id="button" value="提交">
<input type="submit" name="button2" id="button2" value="重置"></td>
</tr>
</table>
</form>
<br>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 以cpsw为例学习linux设备树
- Linux 下 profile 技巧
- 各种内部排序方法的比较
- 安卓中的SQLite数据库的基本操作1
- 负数的原码、补码
- 机器学习（1）PLA
- 使 ie8 的 iframe 透明
- Json，List，Map的数据格式详解。
- iOS的沙盒机制
- QT读取文件夹大小
- JSON的解析之net.sf.json
- 深入浅出Mysql（一）
- angular之service、factory预provider区别
- Android服务器与客户端数据交互（Http协议）
- 拖拽UITextView退出键盘
- UNDERSTANDING THE GAUSSIAN DISTRIBUTION
- OC-KVO的应用
- 一些OO练习
- 黑马程序员 java socket用tcp与udp实现
- iOS - 邮件 短信 通讯录