用ajax和jsp完成用户注册的用户名验证(用户名唯一)

什么是AJAX？

ajax:Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术.

为什么使用ajax?

ajax是一种用于快速创建动态网页的技术，通过后台与服务器进行少量的数据交换,ajax可以使网页实现异步更新，这意味着可以在不重新加载网页的情况下对网页的部分实现更新。而传统的网页(不适用ajax)需要重新加载网页

1.网页代码

<input name='username',value='',required="required" placeholder='请输入用户名' onBlur="checkUserName(this)"/>

2.使用异步做用用户校验

<script>
//异步请求处理对象
function checkUserName(obj){
//1.要创建异步处理对象，XMLHttpRequest
var xmlReq=new XMLHttpRequest();
//2.设置请求数据
//1).get方式请求
/*xmlReq.open("GET","ajaxControll.jsp?userName="+obj.value,true)
var param=null; */
//2).post方式请求
xmlReq.open("POST","ajaxControll.jsp");//打开方式为post
xmlReq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");//设置参数类型
var param="username"+obj.value;
3.设置响应数据处理
xmlReq.onreadystatechange=function(){
//xmlReq.readyState见文知意，这表示异步对象状态
//0(创建异步对象)1(异步请求初始化)2.(发送异步请求准备)3.(发送异步请求)4.(响应完成)
if(xmlReq.readyState==4){//表示响应完成
if(xmlReq.status==200){//表示响应成功
![响应200则表示成功](http://img.blog.csdn.net/20160826210552253)
var json=$.parseJSON(xmlReq.responseText.trim());//接收响应的文本数据，并用jquery把它转换成对象
if(json.isCheck){
//表示名字不是唯一
}else{
//表示名字唯一，可以使用
}

}
}
}
//4.发送请求
xmlReq.send(param);
}
</script>

查询后台检测页面”ajaxControll.jsp”

<%!
//连接数据库查询用户名存不存在
//存在为true,反之false
%>
//处理异步请求
request.setCharacterEncoding("utf-8");//设置编码集，反之乱码
String name=request.getParameter("username");//通过request获得参数值
//使用json:对象或map使用{}，集合或数组使用[]
//属性名，方法，字符串类型属性值，使用双引号引起来
使用out输出流将结果输出
out.print("{\"checkUser\":"+checkUser(name)+"}");
out.flush();