jsp
<%@ page contentType="text/html;charset=UTF-8"
language="java" %>
<html>
<head>
<title>原始用户名校验(返回的数据格式为xml形式)</title>
<script type="text/javascript"
src="js/xmlverify.js"></script>
</head>
<body>
<h2>原始用户名校验</h2>
账号:<input type="text" id="name"
onblur="verify()"> <span
id="tips"></span>
</body>
</html>
JS文件
var
xmlhttp;
//我们这里通过最原始的方式来进行开发
function
verify(){
var
userName=document.getElementByIdx_x("name").value;
xmlhttp=getXmlHttpRequest();
//
if(!xmlhttp){
//
alert("无法创建xmlhttprequest对象");
// }
// else{
//
alert(xmlhttp);
// }
//注册回调函数
//这里callback不能加()否则就会把函数返回值注册了
xmlhttp.onreadystatechange=callback;
//设置连接信息
xmlhttp.open("GET","xmlnametest?name="+userName,true);
xmlhttp.send();
}
function
callback(){
//1表示读取中,2读取完成,3交互中,4完成
if(xmlhttp.readyState==4){
//200表示成功,404表示文件没有找到
if(xmlhttp.status==200){
//获取服务器返回的数据格式为xml形式的
var responseXml=xmlhttp.responseXML;
if(responseXml){
var mes=responseXml.getElementsByTagName_r("reg");
//这里我们要判断一下,是否返回了xml数据
if(mes.length>0){
//利用getElementsByTagName_r();返回节点对象,返回数组形式
var res=mes[0].childNodes[0].nodeValue;
//将数据显示在页面上
document.getElementByIdx_x("tips").innerText=res;
}
else{
alert("xml格式错误"+responseXml);
}
}
else{
alert("xml格式错误"+responseXml);
}
}
}
}
//创建我们的XMLHTTPRequest对象
function
getXmlHttpRequest(){
var
myxmlhttp;
if(window.XMLHttpRequest){
//针对FireFox ,Mozillar,opera,safari,ie8,ie8
myxmlhttp=new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的bug进行修正
if(myxmlhttp.overrideMimeType){
myxmlhttp.overrideMimeType("text/xml");
}
}
//IE6.IE5.5,IE5
//为什么我们把ie的这个判断放在这里
//1,上边可以尽可能应付多种浏览器
//2,现在大多数浏览器为上边
else
if(window.ActiveXObject){
//两个可以用于创建XMLHTTPRequest对象的控件名称,保存在一个Js数组中
//排在前面的版本较新
var activeName=["MSXML2.XMLHTTP","MICROSOFT.XMLHTTP"];
for(var i=0;i<activeName.length;i++){
try{
//取出一个空间进行创建,如果成功终止循环
//创建失败,抛出异常继续循环
xmlhttp=new ActiveXObject(activeName[i]);
break;
}
catch(e){
}
}
}
return
myxmlhttp;
}
action
public
class XmlNameTest extends ActionSupport{
private
String name;
HttpServletResponse response;
public
String execute() throws Exception {
response=ServletActionContext.getResponse();
//response.setContentType("text/xml;charset=utf-8");
response.setCharacterEncoding("utf-8");
PrintWriter out=response.getWriter();
if(name.equals("hanqing")){
out.println("<mes><reg>用户名已经存在</reg></mes>");
}
else {
out.println("<mes><reg>用户名可以使用</reg></mes>");
}
out.flush();
out.close();
return null;
}
public
String getName() {
return name;
}
public void
setName(String name) {
this.name = name;
}
}