原理:
不刷新页面的情况下访问服务器处理数据,并根据数据库的处理结果按你想要的方式对页面做出即使更改。
AJAX发出请求→服务器接收请求,处理请求并将结果返回→AJAX收到结果,按照你设定的方式解析结果并改变页面内容。
1.注册账户实时验证
页面JS
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
var xmlHttp;
function initHttpXMLRequest(){
if(window.ActiveXObject){
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}else{
xmlHttp=new XMLHttpRequest();
}
}
function checkUserName(obs){
initHttpXMLRequest();
//open(请求的方式,请求的url以及参数,true()采用异步的方式请求false(采用的同步方式请求)
xmlHttp.open("GET","checkUserServlet?userName="+obs.value,true);
//设置处理当前AJAX对象请求服务器(服务器响应的有数据(handlerResult是一个函数(处理结果)))
xmlHttp.onreadystatechange=handlerResult;
//发送请求
xmlHttp.send();
}
function handlerResult(){
//判断请求的状态(AJAX对象的状态)
if(xmlHttp.readyState==4){
//判断服务器响应状态(404 500)
if(xmlHttp.status==200){
if(parseInt(xmlHttp.responseText)==1){
document.getElementById("nameInfo").innerHTML="<font color='red' size='-1'>用户名已经存在</font>";
}else{
document.getElementById("nameInfo").innerHTML="<font color='red' size='-1'>用户名未注册</font>";
}
}
}
}
</script>
</head>
<body>
<div style="position:absolute;left:50%;margin-left:-200px;width:400px;top:200px;">
<form action="textServlet" method="post">
<table style="width:100%">
<tr>
<td>用户名</td>
<td>
<input type="text" name="userName" οnblur="checkUserName(this)">
<span id="nameInfo"></span>
</td>
</tr>
<tr>
<td height="10px"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="注册">
<input type="reset" value="取消">
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
注册账户验证过滤器
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet Filter implementation class LoginFilter
*/
public class LoginFilter implements Filter {
public void destroy() {}
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
HttpServletRequest req=(HttpServletRequest) request;
HttpServletResponse resp=(HttpServletResponse) response;
String resource=req.getRequestURI().substring(req.getRequestURI().lastIndexOf("/")+1);
List<String> list=new ArrayList<String>();
list.add("login.jsp");
list.add("login");
list.add("error.jsp");
list.add("checkCodeServlet");
if(!list.contains(resource)){
if(req.getSession().getAttribute("check")==null){
resp.sendRedirect("login.jsp");
}
}
chain.doFilter(req, resp);
}
public void init(FilterConfig fConfig) throws ServletException {}
}