2007-11-23

Ajax+servlet无刷新验证用户名

关键字: Ajax|servlet

页面端(login.jsp):

  1. <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>   
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
  3. <html>   
  4.  <head>   
  5.  <TITLE>Ajax验证用户名是否存在例子</TITLE>   
  6.  <script>   
  7.     
  8.  //设一个变量   
  9.     
  10.  var XMLHttpReq=false;   
  11.   //创建一个XMLHttpRequest对象   
  12.   function createXMLHttpRequest(){   
  13.     if(window.XMLHttpRequest){ //Mozilla    
  14.      XMLHttpReq=new XMLHttpRequest();   
  15.      }   
  16.      else if(window.ActiveXObject){   
  17.       try{   
  18.        XMLHttpReq=new ActiveXObject("Msxml2.XMLHTTP");   
  19.        }catch(e){   
  20.         try{   
  21.          XMLHttpReq=new ActiveXObject("Microsoft.XMLHTTP");   
  22.          }catch(e){}   
  23.          }   
  24.         }   
  25.        }   
  26.   //发送请求函数   
  27.   function send(url){   
  28.    createXMLHttpRequest();   
  29.    XMLHttpReq.open("get",url,true);   
  30.    XMLHttpReq.onreadystatechange=proce;   //指定响应的函数   
  31.    XMLHttpReq.send(null);  //发送请求   
  32.    }   
  33.   function proce(){   
  34.    if(XMLHttpReq.readyState==4){ //对象状态   
  35.     if(XMLHttpReq.status==200){//信息已成功返回，开始处理信息       
  36.                 <!--测试读取xml开始-->   
  37.     var root=XMLHttpReq.responseXML;   
  38.     var res=root.getElementsByTagName("content")[0].firstChild.data;   
  39.     window.alert(res);    
  40.      <!--测试读取xml结束-->      
  41.     //var xmlReturn = XMLHttpReq.responseText;   
  42.     //window.alert(xmlReturn);   
  43.     }else{   
  44.      window.alert("所请求的页面有异常");   
  45.      }   
  46.      }   
  47.      }   
  48.   //身份验证    
  49.   function check(){   
  50.    var name=document.getElementById("name").value;   
  51.        
  52.     if(name==""){   
  53.      alert("请输入姓名!");   
  54.      return false;   
  55.      }   
  56.      else{   
  57.       //send('login?name='+name);     
  58.       document.getElementById("load").style.display='';       
  59.       send('login.do?name='+name);    
  60.       document.getElementById("load").style.display='none';             
  61.       }   
  62.      }   
  63.         
  64.   </script>   
  65.  </head>   
  66.     
  67.  <body>   
  68.  <form action="login" method="post">   
  69.   <table>   
  70.       <tr><td>姓名:&nbsp;<input id="name" type="text" name="name"/><p>   
  71.        <div id=load style="display:none; position:absolute;right:0px;top:0px;background:#FF5B5B;border:1px solid">正在验证用户名,请稍后……</div><p>   
  72.          <input type="button" value="检测!" onClick="check()"/>   
  73.       </td>   
  74.      </tr>   
  75.      </table>   
  76.      </form>   
  77.  </body>   
  78. </html>   
js 代码

AjaxServlet.java

java 代码
  1. import java.io.IOException;   
  2. import java.io.PrintWriter;   
  3. import javax.servlet.ServletException;   
  4. import javax.servlet.http.HttpServlet;   
  5. import javax.servlet.http.HttpServletRequest;   
  6. import javax.servlet.http.HttpServletResponse;   
  7.   
  8.   
  9. public class AjaxServlet extends HttpServlet {   
  10. Logger log = Logger.getLogger(this.getClass());   
  11. public void doGet(HttpServletRequest request, HttpServletResponse response)   
  12.     throws ServletException,IOException {   
  13.    response.setContentType("text/xml; charset=GBK");   
  14.    PrintWriter out = response.getWriter();   
  15.      out.print(2);   
  16.     }   
  17. }   
  18. //Process the HTTP Post request   
  19. public void doPost(HttpServletRequest request, HttpServletResponse response)   
  20.     throws ServletException, IOException {   
  21.    doGet(request, response);   
  22. }   
  23.   
  24. //Process the HTTP Put request   
  25. public void doPut(HttpServletRequest request, HttpServletResponse response)   
  26.     throws ServletException, IOException {   
  27. }   
  28.   
  29. //Process the HTTP Delete request   
  30. public void doDelete(HttpServletRequest request,   
  31.     HttpServletResponse response) throws ServletException, IOException {   
  32. }   
  33.   
  34. //Clean up resources   
  35. public void destroy() {   
  36. }   
  37. }   
  38.   

这只是个基本样子和原理

大致大家可以参照这三个就可以了！

http://hi.baidu.com/k_boy/blog/item/04430d08b66349d362d986b6.html
http://blog.lough.com.cn/post/189.htm
http://www.openforge.cn/html/ajax/20071017/26271.html
评论
发表评论

您还没有登录，请登录后发表评论

lijie250
搜索本博客
最近加入圈子
存档
最新评论