1. regist.jsp file
<%@ page language="java" pageencoding="Utf-8"%><! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" ><html> <head> <title>Verify that the user name exists</title> <script type="text/javascript" src="./regist.js" > </script> </head> <body> <center> <form Action="enctype="application/ X-www-form-urlencoded " method=" POST "> <h3>Please fill in the user registration information</h3> <tableBorder="1"> <tr> <TD>User name:</td> <TD><input type="text" name="username" value = "" id="username"> <div id="Divcheck"></div> <input type="button" name="Checkusername" value ="View user name" id="Checkusername"></td> </tr> <tr> <TD>Password:</td> <TD><input type="password" name="PSW" value=" "></td> </tr> <tr> <TD>Confirm Password:</td> <TD><input type="password" name="CONFPSW" value=" "></td> </tr> <tr> <TD>Date of birth:</td> <TD><input type="text" name= "Birthday" value="" ></td> </tr> </table> </form> </Center> </body></html>
Operating interface:
2.regist file
Window.onload= function(){document.getElementById ("Checkusername"). onclick= function(){ varUsername=document.getelementbyid ("username"). Value;//Gets the value entered in the text box //1. Getting XHR objects varXhr=ajaxfunction ();//2. MonitoringXhr.onreadystatechange= function(){ if(xhr.readystate==4){if(xhr.status== $){varData=xhr.responsetext; document.getElementById ("Divcheck"). Innerhtml=data; } } }//3. Establishing a connectionXhr.open ("POST",".. /servlet/validateusernameservlet ");//4. Sending Data //If the request type is post mode, the request header information needs to be setXhr.setrequestheader ("Content-type","application/x-www-form-urlencoded"); Xhr.send ("Username="+username);//Send the user name entered in the text box as a parameter to the server}} function ajaxfunction(){ varXmlHttp;Try{//Firefox, Opera 8.0+, Safarixmlhttp=NewXMLHttpRequest (); }Catch(e) {Try{//Internet Explorerxmlhttp=NewActiveXObject ("Msxml2.xmlhttp"); }Catch(e) {Try{xmlhttp=NewActiveXObject ("Microsoft.XMLHTTP"); }Catch(e) {} } }returnXmlHttp; }
3.ValidateUsernameServlet
PackageApp.servlet;ImportJava.io.IOException;ImportJavax.servlet.ServletException;ImportJavax.servlet.http.HttpServlet;ImportJavax.servlet.http.HttpServletRequest;ImportJavax.servlet.http.HttpServletResponse; Public class validateusernameservlet extends httpservlet { Public void Doget(HttpServletRequest request, httpservletresponse response)throwsServletexception, IOException {response.setcontenttype ("Text/html;charset=utf-8"); Request.setcharacterencoding ("Utf-8"); String username = Request.getparameter ("username");//Simulation Database if(username==NULL||"". Equals (username)) {response.getwriter (). Write ("User name cannot be empty!" "); }Else if("SA". Equals (username)) {response.getwriter (). Write ("User name already exists"); }Else{response.getwriter (). Write ("User name can be used"); } } Public void DoPost(HttpServletRequest request, httpservletresponse response)throwsServletexception, IOException {doget (request, response); }}
Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.
Black Horse Day17 ajax& implement user name Auto Refresh