页面内容：
function getXMLHttpRequest()
{
var xmlhttp;
if(window.XMLHttpRequest)//
其他浏览器中
XMLHttpRequest
的创建
{
xmlhttp = new XMLHttpRequest();
if(xmlhttp.overrideMimeType)//
解决部分版本的
Mozilla
的
bug
{
xmlhttp.overrideMimeType("text/xml");
}
} else if (window.ActiveXObject) //IE6.0
及以下版本中
XMLHttpRequest
的创建
{
var MSXML =
['MSXML2.XMLHTTP.6.0','MSXML2.XMLHTTP.5.0',
'MSXML2.XMLHTTP.4.0','MSXML2.XMLHTTP.3.0',
'MSXML2.XMLHTTP','Microsoft.XMLHTTP'];
for(var n = 0; n < MSXML.length; n ++)
{
try{
xmlhttp = new ActiveXObject(MSXML[n]);
break;
}catch(e){}
}
}
return xmlhttp;
}
function check()
{
resultNode=document.getElementById("result");
//1.
获取用户名的值
var username=document.getElementById("username").value;
//2.
获取内置对象
xmlHttpRequest
xmlHttpRequest=getXMLHttpRequest();//
获取
xmlHttpRequest
内置对象
//3.
设置回调函数
xmlHttpRequest.onreadystatechange=callback;//
设置回调函数
//4.
向服务器发送请求
xmlHttpRequest.open("GET","ajaxdemo.do?username=" + encodeURI(encodeURI(username))+"&time="+new Date().getTime(),true);
xmlHttpRequest.send(null);//
发送请求
}
function callback()
{
//5.
回调函数中处理服务器返回的数据
if(xmlHttpRequest.readyState == 4)//
请求的状态。有
5
个值
0=
未初始化，
1=
正在加载，
2=
已加载，
3=
交互中，
4=
完成
{
if(xmlHttpRequest.status == 200)
{
var test=xmlHttpRequest.responseText;//
接受服务器返回的数据
resultNode.innerHTML = test;
} else
{
resultNode.innerHTML = "
服务器故障
";
}
}
}
<form name="myform" action="login.do" method="get">
请输入姓名
:<input type="text" id="username" name="name" onBlur="check()"/> <input type="button" onClick="check()" value="
校验用户名
"><br>
<div id="result"></div>
请输入地址
:<input type="text" name="address"/><br>
请输入年龄
:<input type="text"/><br>
<input type="submit" value="
提交
"><input type="reset" value="
重置
">
</form>
Servlet处理端： public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
String username=request.getParameter("username");
username=URLDecoder.decode(username,"utf-8");
UserDao dao=new UserDao(); boolean flag=dao.checkUserName(username); //这是DAO层的数据库查询方法 ，查询username是否已存在。
PrintWriter out=response.getWriter();
if(flag) {
out.println("此用户名可以使用!
");
} else {
out.println("此用户名已经被占用,请更换一个用户名！
");
}
}
以上的是源码。以前做的练习，没有经过整理，有点繁杂，不过很详细。还有因为我是直接将代码粘贴上来的，csdn直接将代码生成了页面，最后不得不有所删减，所以页面上的内容只写了js的一些方法，其实最主要的就是这些，其他的内容大家都懂，