Ajax应用简单实例

<% ... @pagelanguage = " java " contentType = " text/html;charset=GBK " %>
< script language ="javascript" type ="text/javascript" > ...
<!--
var http = getHTTPObject();

function getHTTPObject() ... {
var xmlhttp = false ;
if (window.XMLHttpRequest) ... {
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) ... {
xmlhttp.overrideMimeType( " text/xml " );
}
} else ... {
try ... {
xmlhttp = new ActiveXObject( " Msxml2.XMLHTTP " );
} catch (e) ... {
try ... {
xmlhttp = new ActiveXObject( " Microsoft.XMLHTTP " );
} catch (E) ... {
xmlhttp = false ;
}
}
}
return xmlhttp;
}

function chkUser() ... {
var url = " CheckUserAndComNm.jsp " ;
var name = document.getElementById( " username " ).value;
url += " ?oprate=chkUser&userName= " + name;

http.open( " GET " ,url, true );
http.onreadystatechange = handleHttpResponse;
http.send( null );
return ;
}

function handleHttpResponse() ... {
if (http.readyState == 4 ) ... {
if (http.status == 200 ) ... {
var xmlDocument = http.responseXML;
if (http.responseText != "" ) ... {
document.getElementById( " showStr " ).style.display = "" ;
document.getElementById( " userName " ).style.background = " #FF0000 " ;
document.getElementById( " showStr " ).innerText = http.responseText;
} else ... {
document.getElementById( " userName " ).style.background = " #FFFFFF " ;
document.getElementById( " showStr " ).style.display = " none " ;
}
} else ... {
alert( " 你所请求的页面发生异常,可能会影响你浏览该页的信息 " );
alert(http.status);
}
}
}
// -->
</ script >
< body topmargin ="0" >
< form name ="form1" method ="post" action ="CheckUserAndComNm.jsp" >
< table width ="100%" >
< tr >< td align ="center" >< H2 > Ajax演示程序 </ H2 ></ td ></ tr >
< tr >< td align ="center" > 个人注册 </ td ></ tr >
</ table >

< HR >

< table width ="400" border ="0" cellpadding ="1" cellspacing ="1" align ="center" >
< tr >
< td >< font color ="red" > * </ font ></ td >
< td > 用户帐号: </ td >
< td >
< input type ="text" name ="userName" maxlength ="20" style ="background:#FFFFFF" onBlur ="chkUser()" value ="" />

</ td >
</ tr >

< tr >
< td colspan =3 >
< span id ="showStr" style ="background-color:#FF9900;display:none" ></ span >
</ td >
</ tr >

</ table >

< div align ="center" >
< input type ="submit" name ="ok" value ="确定" >
< input type ="reset" name ="reset" value ="取消" >
</ div >
</ form >
</ body >

<% ... @pagelanguage = " java " contentType = " text/html;charset=GB2312 "
pageEncoding = " GB2312 " %>

<% ...
String msgStr = "" ;
String oprate = request.getParameter( " oprate " );
String userName = request.getParameter( " userName " );
// out.println( " oprate= " + oprate);
// out.println( " userName= " + userName);
try{
if (oprate.equals( " chkUser " ))
{
response.setContentType( " text/html;charset=GB2312 " );
if (userName.length() < 5 ||userName.length() > 20 )
{
msgStr = " 用户名必须为字母,数字或下划县,长度为5-20个字符! " ;
} else {
if (userName.equals( " oscar " ))
msgStr = " 对不起,此用户已经存在 " ;
else
msgStr = "" ;

}
}
response.getWriter().write(msgStr);
}catch(Exceptione){

}finally{
// request.setAttribute( " url " ,url);
}


%>