A simple Ajax asynchronous request

　　

To automatically determine if the user name is correct when the mouse cursor is moved

HTML code

1 Username:<type= "text"  name= "username"  ID = "username" onblur = "Validate ();" /> 2 <  ID= "message"></span>

JS code get XMLHttpRequest Object

1<script type= "Text/javascript" >2     //get XMLHTTP objects for different browsers3         functiongetxmlhttprequest () {4             varxmlHttp;6             Try{7                 //Firefox opera8XmlHttp =NewXMLHttpRequest (); 9}Catch(e) {Ten                 Try{ OneXmlHttp =NewXMLHttpRequest ("Msxml2.xmlhttp"); A}Catch(e) { -                     Try{ -                     //low version of IE theXmlHttp =NewXMLHttpRequest ("Microsoft.XMLHTTP");  -}Catch(e) { -Alert ("This browser does not support ajax!"); -                         return false; +                     } -                 } +             } A              at             returnxmlHttp; -              -}

JS code after mouse move asynchronous commit judgment

1         functionValidate () {2             //Get XMLHTTP Object3             varXmlHttp =getxmlhttprequest ();4             //gets the value of the username5             varUsername = document.getElementById ("username"). Value;6             //Send to Server7             //Transfer parameter Request mode address is an asynchronous request8Alert ("SSSs");9Xmlhttp.open ("GET", "/javascript0505/checkedusernameservlet?username=" +username,true);Ten             //Send Request One xmlhttp.send (); A             //Get Server Response -Xmlhttp.onreadystatechange=function(){ -                 if(xmlhttp.readystate==4){ the                     if(xmlhttp.status==200){ -                         varText =Xmlhttp.responsetext; -                         varOspan = document.getElementById ("message"); -Ospan.innerhtml=text; +                     } -                 } +             } A         } at     

There is a little difference in the post request to pass parameters before you add a code parameter that can be passed in the Send () method;

1 xmlhttp.open ("POST", "/javascript/checkusernameservlet",true); 2             Xmlhttp.setrequestheader ("Content-type", "application/x-www-form-urlencoded"); 3             Xmlhttp.send ("username=" +username);

Server-side code

1  Public voidDoPost (httpservletrequest request, httpservletresponse response)2             throwsservletexception, IOException {3                         //set the encoding format for requests and responses4Request.setcharacterencoding ("Utf-8");5Response.setcontenttype ("Text/html;charset=utf-8");6List<string> names=arrays.aslist ("Zhang San", "John Doe", "Harry");7String username = request.getparameter ("username");8             if(Names.contains (username)) {9Response.getwriter (). println ("<font color= ' Red ' > Username available!) </font> ");Ten}Else{ OneResponse.getwriter (). println ("<font color= ' Red ' > username is not available! </font> "); A             } -}

A simple Ajax asynchronous request