AJAX(异步JavaScript和XML)注册账户实时验证

原理:

不刷新页面的情况下访问服务器处理数据,并根据数据库的处理结果按你想要的方式对页面做出即使更改。

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 {}

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值