需求: 利用ajax实现 当输入用户名时,验证该用户名是否已经存在,如果存在,给出重新输入用户名,不存在,提示可以使用。简单起见,如果用户名不等于 'shizhan',则可以使用。
html页面:
- <%@pagelanguage="java"pageEncoding="utf-8"%>
- <!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
- <html>
- <head>
- <scripttype="text/javascript"src="js/register.js"></script>
- </head>
- <body>
- <form>
- 用户名
- <inputtype="text"name="username"id="username"/>
- <inputtype="button"value="提交"id="btn1"/>
- <divid="myDiv"></div>
- </form>
- </body>
- </html>
我们利用js给提交按钮绑定事件。js代码:
[javascript]
view plain
copy
- varxmlhttp;
- window.onload=function()
- {
- varbtn1=document.getElementById("btn1");
- btn1.onclick=loadXMLDoc;
- }
- functionloadXMLDoc()
- {
- if(window.XMLHttpRequest)
- {
- xmlhttp=newXMLHttpRequest();
- }
- else
- {
- xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
- }
- xmlhttp.onreadystatechange=function()
- {
- if(xmlhttp.readyState==4&&xmlhttp.status==200)
- {
- document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
- }
- }
- varname=document.getElementById("username").value;
- xmlhttp.open("POST","AjaxServlet",true);
- xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
- xmlhttp.send("name="+name);
- }
响应的servlet:
- packagecom.servlet;
- importjava.io.IOException;
- importjava.io.PrintWriter;
- importjavax.servlet.ServletException;
- importjavax.servlet.http.HttpServlet;
- importjavax.servlet.http.HttpServletRequest;
- importjavax.servlet.http.HttpServletResponse;
- publicclassAjaxServletextendsHttpServlet{
- publicvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)
- throwsServletException,IOException{
- doPost(request,response);
- }
- publicvoiddoPost(HttpServletRequestrequest,IOException{
- response.setContentType("text/html");
- response.setCharacterEncoding("utf-8");
- PrintWriterout=response.getWriter();
- Stringname=request.getParameter("name");
- System.out.println(name);
- if(name.equals("shizhan"))
- {
- out.write("用户名已经存在,请更换");
- }
- else
- {
- out.write("用户名可以使用");
- }
- out.flush();
- out.close();
- }
- }
结果页面:
输入sss,点击提交
输入shizhan,点击提交
来源:http://blog.csdn.net/linshizhan/article/details/7915939 (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|