JSp+ajax用户登录验证

0

JSp+ajax用户登录验证0

 
用户登陆界面，想要实现输入账号之后离开输入框就验证该账号是否存在，输入角色、账号、密码之后，点击登录，如果正确就跳转到index.jsp，错误不跳转并且在密码输入框下显示提示信息；有一个没输入就提示，信息也是在密码输入框下。 

我现在的问题是：若果什么也不输，点击登录，会闪一下，但闪过之后就是重置了页面。输入正确也是闪一下就重置页面.账号验证没问题，就是登录有问题，但是搞不定，大侠们看看吧！ 
login.jsp 

Java代码  

1. <form id="form" name="form" method="post" action="" >  
2.             <table  border="0">  
3.                   
4.                       
5.                     <tr>  
6.                     <td align="right">角色类型：</td>  
7.                     <td><select name="role" id="role" onBlur="checkRole(this)">  
8.                     <option value="0">-请选择角色-</option>  
9.                             <%  
10.                                 List<Role> list = new ArrayList<Role>();  
11.                                     RoleDao dao = new RoleDaoImpl();  
12.                                     list = dao.findAllRoles();//调用实现类的查询全部方法  
13.                                     for (int i = 0; i < list.size(); i++) {  
14.                                         Role r = list.get(i);  
15.                             %>  
16.                             <option value="<%=r.getR_id()%>"><%=r.getR_name()%></option>  
17.                             <%  
18.                                 }  
19.                             %>  
20.                     </select>  
21.                     </td>  
22.                     <td align="left">  
23.                                 &nbsp;  
24.                                 <span id="roleSpan"></span>  
25.                             </td>  
26.                 </tr>  
27.                 <tr>  
28.                     <td align="right">账号：</td>  
29.                     <td>  
30.                     <input type="text" name="number" id="number" οnblur="checkNumber(this)">  
31.                     </td>  
32.                      <td width="256" align="left">  
33.                                 &nbsp;  
34.                                 <span id="numberSpan"></span>  
35.                             </td>  
36.                     </tr><!--  当输入名字后离开输入框即调用-->  
37.                 <tr>  
38.                     <td align="right">密码：</td>  
39.                     <td><input type="password" name="pwd" id="pwd" onBlur="checkPsw(this)" >  
40.                     </td>  
41.                     <td align="left">  
42.                                 &nbsp;  
43.                                 <span id="pwdSpan"></span>  
44.                             </td>  
45.                 </tr>  
46.                 <tr>  
47.              <td  align="left">&nbsp;<span id="feedback_info"></span></td>  
48.         </tr>  
49.                 <tr>  
50.                     <td colspan="1">  
51.                                 <input type="submit" value="登录" οnclick="checkLogin(this.form)"/>  
52.                          
53.                         <input type="button" value="注册"  
54.                         οnclick="javascript:window.location.href='User/Register.jsp'"></td>  
55.                   
56.                 </tr>  
57.             </table>  
58.         </form>  

login.js 

Java代码  

1. var xmlHttp;  
2.     function createXMLHttpRequest() {  
3.         if (window.XMLHttpRequest) {  
4.             var xmlHttp = new XMLHttpRequest(); //mozilla浏览器     
5.         }  
6.         else if (window.ActiveXObject) {  
7.             try {  
8.                 var xmlHttp = new ActiveX0bject("Msxml2.XMLHTTP"); //IE老版本     
9.             }  
10.             catch (e)  
11.             { }  
12.             try {  
13.                 var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); //IE新版本     
14.             }  
15.             catch (e)  
16.             { }  
17.         }  
18.         if (!xmlHttp) {  
19.             window.alert("不能创建XMLHttpRequest对象实例");  
20.             return false;  
21.         }  
22.         else  
23.             return xmlHttp;  
24.         }///花括号放错地方  
25.     }  
26.    
27.  // 检查账号，给出提示信息  
28.     function checkNumber(Number) {  
29.         var numberSpan = document.getElementById("numberSpan");  
30.           
31.         if (Number.value == "") {  
32.             numberSpan.innerHTML = "账号必须填写".fontcolor("red");  
33.             return false;  
34.         } else {  
35.               
36.          xmlHttp = createXMLHttpRequest(); //createXMLHttpRequest申明的是局部变量，这里访问不到xmlHttp，要给xmlHttp变量赋值才行  
37.         var url="servlet/CheckNumberServlet?number="+Number.value+"&LoginTime="+new Date().getTime();   
38.         url = encodeURI(url);  //转换码后再传输   
39.         xmlHttp.open("GET",url,true);//加时间戳防止IE缓存  
40.         //xmlhttp.setRequestHeader( "Content-Type", "text/html;charset=UTF-8" );  
41.         xmlHttp.onreadystatechange = handleStateChange1;  
42.         xmlHttp.send(null);  
43.         return true;  
44.         }  
45.     }  
46.    
47.     function handleStateChange1() {  
48.         var numberSpan = document.getElementById("numberSpan");  
49.           
50.         if (xmlHttp.readyState == 4) {  
51.             if (xmlHttp.status == 200) {  
52.                // alert("来自服务器的响应："+xmlHttp.responseText);     
53.                if (xmlHttp.responseText == 'true') {///responseText是字符串，不能和boolean变量直接比较  
54.                   // alert("存在");     
55.                    numberSpan.innerHTML = "<img src='Img/g.gif'>";  
56.                     document.getElementById("feedback_info").innerHTML="";  
57.                     return true;  
58.                 }  
59.                 else if (xmlHttp.responseText == 'false') {///responseText是字符串，不能和boolean变量直接比较  
60.                  // alert("不存在");     
61.                     numberSpan.innerHTML = "账号不存在".fontcolor("red");  
62.                     return false;  
63.                 }  
64.                  
65.             }  
66.             else alert("服务器端错误");  
67.         }  
68.     }  
69.  // 检查密码，给出提示信息  
70.     function checkPsw(pswNode) {  
71.         var spanNode1 = document.getElementById("pswSpan");  
72.         var Role= document.getElementById("role");  
73.         var Number= document.getElementById("number");  
74.         if (pswNode.value == "") {  
75.             spanNode1.innerHTML = "密码必须填写".fontcolor("red");  
76.             return false;  
77.         } else {  
78.               
79.              pwdSpan.innerHTML = "<img src='Img/g.gif'>";  
80.             document.getElementById("feedback_info").innerHTML="";  
81.             return true;  
82.             }  
83.         }  
84.       
85.     // 检查是否选中角色  
86.     function checkRole(selNode) {  
87.         var index = selNode.selectedIndex;// 获得选中下标  
88.         var spanNode1 = document.getElementById("roleSpan");  
89.         if (index <= 0) {  
90.             spanNode1.innerHTML = "必须选择角色".fontcolor("red");  
91.             return false;  
92.         } else {  
93.             spanNode1.innerHTML = "<img src='Img/g.gif'>";  
94.             document.getElementById("feedback_info").innerHTML="";  
95.             return true;  
96.         }  
97.     }  
98.     // 检查表单  
99.     function checkLogin(o) {  
100.           
101.         var Role=o.role;  
102.         var Number= o.number;  
103.         var Pwd= o.pwd;  
104.         if(checkNumber(Number)&&checkPsw(Psw) &&checkRole(Role))  
105.             {  
106.          xmlHttp = createXMLHttpRequest(); //createXMLHttpRequest申明的是局部变量，这里访问不到xmlHttp，要给xmlHttp变量赋值才行  
107.         var url="servlet/CheckLoginServlet?number="+Number.value+"&role="+Role.value+"&pwd="+Pwd.value+"&LoginTime="+new Date().getTime();   
108.         url = encodeURI(url);  //转换码后再传输   
109.         xmlHttp.open("GET",url,true);//加时间戳防止IE缓存  
110.         //xmlhttp.setRequestHeader( "Content-Type", "text/html;charset=UTF-8" );  
111.         xmlHttp.onreadystatechange = handleStateChange2;  
112.         xmlHttp.send(null);  
113.         return true;  
114.             }  
115.         else{  
116.             document.getElementById("feedback_info").innerHTML="请填写每一项".fontcolor("red");  
117.             return false;  
118.         }  
119.     }  
120.     function handleStateChange2() {  
121.         if (xmlHttp.readyState == 4) {  
122.             if (xmlHttp.status == 200) {  
123.                //alert("来自服务器的响应：" + xmlHttp.responseText);     
124.                 if(xmlHttp.responseText == '0'){  
125.                     document.getElementById("feedback_info").innerHTML="账号与密码不匹配".fontcolor("red");  
126.                     return false;  
127.                 }  
128.                 else if(xmlHttp.responseText == '1'){  
129.                       
130.                     document.getElementById("feedback_info").innerHTML="";  
131.                     window.location.href="index.jsp";  
132.                     return true;  
133.                 }  
134.             }  
135.             else alert("服务器端错误");  
136.         }  
137.     }  

chuckLoginservlet 

Java代码  

1. public void doGet(HttpServletRequest request, HttpServletResponse response)  
2.   
3.     throws ServletException, IOException {  
4.         response.setContentType("text/html");  
5.         doPost(request, response);// 调用doPost方法  
6.     }  
7.   
8.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
9.             throws ServletException, IOException {  
10.         request.setCharacterEncoding("utf-8");  
11.         response.setContentType("text/html;charset=UTF-8");  
12.   
13.         String number="";  
14.         try {  
15.             number = new String(request.getParameter("number").getBytes(  
16.                     "ISO-8859-1"), "UTF-8");  
17.         } catch (Exception e1) {  
18.             System.out.println("number为空");  
19.         }  
20.           
21.         String role="0";  
22.         int rID=0;  
23.         try {  
24.             role = new String(request.getParameter("role").getBytes(  
25.                     "ISO-8859-1"), "UTF-8");  
26.             rID=Integer.parseInt(role);//把获得的role的值转成整型  
27.         } catch (Exception e1) {  
28.             System.out.println(request.getParameter("role")+"******role");  
29.         }  
30.           
31.         String pwd="";  
32.         try {  
33.             pwd = new String(request.getParameter("pwd").getBytes(  
34.                     "ISO-8859-1"), "UTF-8");  
35.         } catch (Exception e) {  
36.   
37.          System.out.println(request.getParameter("pwd")+"****pwd");  
38.         }  
39.         // String txt = new String(number.getBytes("ISO-8859-1"), "UTF-8");  
40.         // System.out.println(txt+"********");  
41.         PrintWriter out = response.getWriter();  
42.         User u = new User();  
43.         UserDao ud = new UserDaoImpl();  
44.         u = ud.findUserByNumber(number);//通过账号找到用户对象  
45.   
46.         if (u != null) {// 找到该用户  
47.           
48.                 int u_id = u.getU_id();// 获得该用户的ID  
49.                 UserRole ur = new UserRole();  
50.                 UserRoleDao urd = new UserRoleDaoImpl();  
51.                 ur = urd.findUserRoleByUserId(u_id);// 找到中间表UserRole的记录  
52.                 int r_id = ur.getRole().getR_id();// 由Userrole表找到Role表的相对应角色名称  
53.                 if (r_id==rID && u.getU_password().equals(pwd))// 如果数据中的角色和密码与之对应  
54.                 {  
55.                     out.write("1");//1表示验证通过  
56.                 } else {  
57.                     out.write("0");//0表示密码与账号不匹配  
58.                 }  
59.   
60.             }  
61.           
62.         out.flush();  
63.         out.close();  
64.     }