Use the jquery framework: Download jquery. js
Create a web project ajax;
Create a jslib folder under webRoot: specifically store js files;
Create an html/jsp page under webRoot:
Login.html
Copy codeThe Code is as follows: <script type = "text/javascript" src = "jslib/jquery. js"> </script>
<Script type = "text/javascript" src = "jslib/verify. js"> </script>
</Head>
<Body>
<H1> user verification <! -- Form submission is not required in ajax -->
<! -- The name attribute is not required in the input tag. Only the id attribute is used. -->
<! -- Use the id attribute to use dom -->
<Input type = "text" id = "username"/> <br/>
<Input type = "button" value = "verify" onclick = "verify ()"/>
<! -- Div is empty to store the information returned by the server -->
<Div id = "result"> </div>
</Body>
Create a js file under jslib:
Verify. js;Copy codeThe Code is as follows: function verify ()
{
Var paramObj = encodeURI ($ ("# username"). val ()));
$. Get ("TestSvlt? Username = "+ paramObj, null, callback );
}
Function callback (data)
{
Var resultObj = $ ("# result ");
ResultObj.html (data );
}
Create a new servlet: AjaxLogin class; write it in the doGet MethodCopy codeThe Code is as follows: response. setContentType ("text/html; charset = UTF-8 ");
PrintWriter out = response. getWriter ();
String name = request. getParameter ("username ");
String username = URLDecoder. decode (name, "UTF-8 ");
System. out. println (username );
If (null = username | "". equals (username ))
{
Out. print ("username is not null ");
}
Else
{
If (! "Lej". equals (username ))
{
Out. print (username + "not existing ");
}
Else {
Out. print (username + "login successs ");
}
}