Form.html
<html>
<head>
<title>表单验证</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript">
function formcheck(){
var url="formcheck";
var userid=document.getElementById("userid").value;
var userpwd=document.getElementById("userpwd").value;
var params="userid="+userid+"&userpwd="+userpwd;
sendRequest(url,params,'POST',showresult);
}
function showresult(){
if (httpRequest.readyState == 4) {
if (httpRequest.status == 200) {
var info=httpRequest.responseText;
document.getElementById("result").innerHTML=info;
}
}
}
function checkpassword(){
var password = document.getElementById("userpwd").value;
var repassword = document.getElementById("userpwd1").value;
if(password == ""){
alert("请输入密码");
document.getElementById("password").focus();
return ;
}
if(password != repassword){
alert("输入的密码不一致,请重新输入");
document.getElementById("password").focus();
}
}
function checkage(){
var age = document.getElementById("age").value;
if(age<10||age>30){
alert("输入年龄范围应该为10岁至30岁");
document.getElementById("age").focus();
return false;
}
}
</script>
</head>
<body>
<h1 align="center"><font color="red">用户注册</font></h1>
<form action="">
<table border="0" align="center" width="600">
<tr><td align="right">用户名:</td>
<td><input type="text" name="userid" id="userid" onblur="formcheck()"/></td>
</tr>
<tr><td align="right">性别:</td>
<td><input type="radio" name="userSex" value="男"/>男
<input type="radio" name="userSex" value="女"/>女</td>
</tr>
<tr><td align="right">密码:</td>
<td><input type="password" name="userpwd" id="userpwd"/></td>
</tr>
<tr><td align="right">确认密码:</td>
<td><input type="password" name="userpwd" id="userpwd1" onblur="checkpassword()"/></td>
</tr>
<tr><td align="right">年龄:</td>
<td><input type="text" name="age" id="age" onblur="checkage()"/></td>
</tr>
<tr><td colspan="3" align="center" height="40">
<input type="button" value="注册" onclick="formcheck()"/>
<div id="result"></div>
</td>
</tr>
</table>
</form>
</body>
</html>
FormCheck.java
package servlers;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class FormCheck extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
request.setCharacterEncoding("UTF-8");
String userid=request.getParameter("userid");
if("XXX".equals(userid)){
out.print("用户名已存在");
}
}
}