使用原生Ajax 验证用户名是否被注册
创建出注册信息：
<h1>注册信息</h1>
<input type="text" name="txtName" id="txtName"/> <span id="msg"></span><br/>
<input type="password" name="txtPwd"/>
//创建myajx
function myajax(){
//01.定制出 xhr对象
var xhr;
//02.能力检测
if(window.XMLHttpRequest){
//非IE浏览器
xhr=new XMLHttpRequest();
}else{
//IE内核
xhr=new ActiveXObject("Microsoft.XMLHttp");
}
var dom=document.getElementById("txtName");
var myspan=document.getElementById("msg");
var myval=dom.value;
//03.构建请求地址
//xhr.open("请求类型","请求地址","是否异步");
xhr.open("get","<%=path%>/servlet/CheckUserServlet?uname="+myval,true);
//04.设置回调函数 响应回来的数据
xhr.onreadystatechange=function(){
//什么
if(xhr.readyState==4&&xhr.status==200){
//获取响应数据
var data=xhr.responseText;
if(data=='OK'){
myspan.innerText="用户名已经被注册";
}else{
myspan.innerText="用户名可以注册";
}
}
};
//05.用send真正的发送请求
xhr.send(null);
}
//用js的方式锁定焦点，并且失去焦点的时候执行myajax
window.onload=function(){
var dom=document.getElementById("txtName");
dom.onblur=function(){
myajax();
};
};
//ajax访问的servlet 内容
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String name =request.getParameter("uname");
if(name.equals("admin")){
response.getWriter().write("OK");
}else{
response.getWriter().write("NO");
}
}