AJAX

最新推荐文章于 2024-06-20 09:53:57 发布

BladeeTran

最新推荐文章于 2024-06-20 09:53:57 发布

阅读量362

点赞数

分类专栏： 11

11 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

AJAX 的小应用，小范围刷新，判断用户名是否已经注册。

我最后才发现传值的时候如果是中文就会出现乱码问题，所有我用了网上教的两次编码1次解码去解决问题了。

1、页面代码

[html]view plaincopy 
    
 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
 <%  
 String path = request.getContextPath();  
 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
 %>  
   
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
 <html>  
   <head>  
     <base href="<%=basePath%>">  
       
     <title>My JSP '14-4-21_AJAS_logon.jsp' starting page</title>  
       
     <meta http-equiv="pragma" content="no-cache">  
     <meta http-equiv="cache-control" content="no-cache">  
     <meta http-equiv="expires" content="0">      
     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
     <meta http-equiv="description" content="This is my page">  
     <!-- 
     <link rel="stylesheet" type="text/css" href="styles.css"> 
     -->  
   
   
   </head>  
   <script type="text/javascript">  
   var xhr=null;  
     
   function checkUname(){  
       var username=document.myform.uname.value;  
       if(username==""||username==null){  
             document.getElementById("msgDiv").innerHTML="<font color='red'>请输入用户名</font>";  
           }  
           
         if(window.ActiveXObject){  
             xhr=new ActiveXObject("Microsoft.XMLHTTP");  
             }else{  
                 xhr=new XMLHttpRequest();//只对非IE浏览器生效  
                   
                 }  
       
         var url="http://localhost:8080/Five_0001_Kt/TestServlet_005_14421_Login?uname="+username;  
         url=encodeURI(url);  
         url=encodeURI(url); //两次编码  
         xhr.onreadystatechange=haolejiaowo;   //当核心对象状态发生改变，它的处理函数  
         xhr.open("post",url,true);  
         xhr.send(null);  
           
       }  
   function haolejiaowo(){  
       if(xhr.readyState==4&&xhr.status==200){  
         var result=xhr.responseText;//得到远程服务器返回的结果  
         if(result.indexOf("true")!=-1){  
           document.getElementById("msgDiv").innerHTML="<font color='red'>用户名已存在</font>";;  
         }else{  
           document.getElementById("msgDiv").innerHTML="可以注册";  
         }  
         }  
       }  
   
     
   </script>  
     
     
   <body>  
     <form action="#" method="post" name="myform" >  
     
     <input type="text" name="uname" onblur="checkUname()"/>  
     <div id="msgDiv" style="display:inline">aaa</div>  
     <br/>  
     <input type="submit"value="注册">   
     </form>  
       
       
       
   </body>  
 </html>  

2、servlet代码

[java]view plaincopy 
    
 package PractiseServlet;  
   
 import java.io.IOException;  
 import java.io.PrintWriter;  
   
 import javax.servlet.ServletException;  
 import javax.servlet.http.HttpServlet;  
 import javax.servlet.http.HttpServletRequest;  
 import javax.servlet.http.HttpServletResponse;  
   
 public class TestServlet_005_14421_Login extends HttpServlet {  
   
     public boolean isExist(String name){  
         boolean flag=false;  
         String []names={"admin","xiaopang","房智晨"};  
         for(String s:names){  
             if(name.equals(s)) flag=true;  
         }  
         return flag;  
     }  
       
     public void doGet(HttpServletRequest request, HttpServletResponse response)  
             throws ServletException, IOException {  
         this.doPost(request, response);  
     }  
   
   
     public void doPost(HttpServletRequest request, HttpServletResponse response)  
             throws ServletException, IOException {  
         response.setContentType("text/html;charset=utf-8");  
           
         PrintWriter out = response.getWriter();  
       
         String username=request.getParameter("uname");  
         username = java.net.URLDecoder.decode(username, "UTF-8");//一次解码  
         System.out.println(username);  
         boolean flag=isExist(username);  
         out.println(flag);  
           
         out.flush();  
         out.close();      
           
     }  
   
 }  