AJAX+JSP GET與POST方式參數傳遞的應用

 

Ajax.html頁面

  1. <!DOCTYPE html> 
  2. <html> 
  3.     <head> 
  4.         <title></title> 
  5.         <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
  6.         <script type="text/javascript"> 
  7.             var xmlhttp;  
  8.             function SubMit()  
  9.             {  
  10.                 //非IE瀏覽器XMLHttpRequest對象的創建  
  11.                 if (window.XMLHttpRequest)  
  12.                     {  
  13.                         xmlhttp=new XMLHttpRequest();  
  14.                     }  
  15.                     //IE瀏覽器XMLHttpRequest對象的創建  
  16.                     else if(window.ActiveXObject)  
  17.                     {  
  18.                         var activename=["Msxml2.XMLHTTP","Msxml.XMLHTTP","Microsoft.XMLHTTP"];  
  19.                         for (i=0;activename.length;i++)  
  20.                             {  
  21.                                 try{  
  22.                                     xmlhttp=new ActiveXObject(activename[i]);  
  23.                                     break;  
  24.                                 }  
  25.                                 catch(e){}  
  26.                             }              
  27.                     }  
  28.                if (xmlhttp)  
  29.                   {   
  30.                        document.getElementById("message").innerHTML="開始用戶名測試...";  
  31.                        window.setTimeout('postxml()',2000);  //2秒後執行          
  32.                    }  
  33.                    else  
  34.                    {  
  35.                      alert("你的瀏覽器不支持XMLHttpRequest對象");        
  36.                    }  
  37.  
  38.  
  39.             }  
  40.             function godo()  
  41.             {  
  42.                   //判斷服務器是否有返回值  
  43.                    if(xmlhttp.readyState == 4)  
  44.                    //判斷HTTP請求是否正確  
  45.                        {  
  46.                            if(xmlhttp.status  == 200)  
  47.                            {  
  48.                                //獲得服務器返回的數據  
  49.                                document.getElementById("message").innerHTML=xmlhttp.responseText;  
  50.                            }  
  51.                        }  
  52.             }  
  53.             //採用get方式傳遞參數  
  54.             function getxml()  
  55.             {  
  56.                var uname=document.getElementById("UserName");  
  57.                xmlhttp.open("get","AjaxServlet?uname="+uname.value,true)  
  58.                xmlhttp.onreadystatechange=godo;  
  59.                xmlhttp.send(null);      
  60.             }  
  61.             //採用post方式傳遞參數  
  62.              function postxml()  
  63.             {  
  64.                var uname=document.getElementById("UserName");  
  65.                xmlhttp.open("post","AjaxServlet",true)  
  66.                xmlhttp.onreadystatechange=godo;  
  67.                xmlhttp.setRequestHeader ("Content-Type","application/x-www-form-urlencoded");  
  68.                xmlhttp.send("uname="+uname.value);      
  69.             }             
  70.         </script> 
  71.     </head> 
  72.     <body> 
  73.         <input type="text" id="UserName"/> 
  74.         <input type="button" value="用戶名驗證" onclick="SubMit();"/> 
  75.         <div id="message"></div> 
  76.     </body> 
  77. </html> 

AjaxServlet.java頁面

  1. protected void proce***equest(HttpServletRequest request, HttpServletResponse response)  
  2.          throws ServletException, IOException {  
  3.      response.setContentType("text/html;charset=UTF-8");  
  4.      PrintWriter out = response.getWriter();  
  5.      try {  
  6.          String old=request.getParameter("uname");  
  7.          if(old == null || "".equals(old))  
  8.          {  
  9.              out.println("用戶名不可以爲空");  
  10.          }else{  
  11.              String name = new String(old.getBytes("ISO8859-1"),"gb2312");  
  12.              System.out.println(name);  
  13.              if(name.equals("123"))  
  14.              {  
  15.                  out.println("用戶名"+ name + "已經存在!");  
  16.                    
  17.              }else{  
  18.                  out.println("用戶名"+ name + "可以註冊!");  
  19.              }  
  20.          }  
  21.      } finally {              
  22.          out.close();  
  23.      }  
  24.  } 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章