您的位置:首页 > Web前端 > JavaScript

JSp+ajax用户登录验证

2014-04-11 17:54 232 查看
0


JSp+ajax用户登录验证0


 

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

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

login.jsp 

Java代码  



<form id="form" name="form" method="post" action="" >  

            <table  border="0">  

                  

                      

                    <tr>  

                    <td align="right">角色类型:</td>  

                    <td><select name="role" id="role" onBlur="checkRole(this)">  

                    <option value="0">-请选择角色-</option>  

                            <%  

                                List<Role> list = new ArrayList<Role>();  

                                    RoleDao dao = new RoleDaoImpl();  

                                    list = dao.findAllRoles();//调用实现类的查询全部方法  

                                    for (int i = 0; i < list.size(); i++) {  

                                        Role r = list.get(i);  

                            %>  

                            <option value="<%=r.getR_id()%>"><%=r.getR_name()%></option>  

                            <%  

                                }  

                            %>  

                    </select>  

                    </td>  

                    <td align="left">  

                                   

                                <span id="roleSpan"></span>  

                            </td>  

                </tr>  

                <tr>  

                    <td align="right">账号:</td>  

                    <td>  

                    <input type="text" name="number" id="number" onblur="checkNumber(this)">  

                    </td>  

                     <td width="256" align="left">  

                                   

                                <span id="numberSpan"></span>  

                            </td>  

                    </tr><!--  当输入名字后离开输入框即调用-->  

                <tr>  

                    <td align="right">密码:</td>  

                    <td><input type="password" name="pwd" id="pwd" onBlur="checkPsw(this)" >  

                    </td>  

                    <td align="left">  

                                   

                                <span id="pwdSpan"></span>  

                            </td>  

                </tr>  

                <tr>  

             <td  align="left"> <span id="feedback_info"></span></td>  

        </tr>  

                <tr>  

                    <td colspan="1">  

                                <input type="submit" value="登录" onclick="checkLogin(this.form)"/>  

                         

                        <input type="button" value="注册"  

                        onclick="javascript:window.location.href='User/Register.jsp'"></td>  

                  

                </tr>  

            </table>  

        </form>  

login.js 

Java代码  



var xmlHttp;  

    function createXMLHttpRequest() {  

        if (window.XMLHttpRequest) {  

            var xmlHttp = new XMLHttpRequest(); //mozilla浏览器     

        }  

        else if (window.ActiveXObject) {  

            try {  

                var xmlHttp = new ActiveX0bject("Msxml2.XMLHTTP"); //IE老版本     

            }  

            catch (e)  

            { }  

            try {  

                var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); //IE新版本     

            }  

            catch (e)  

            { }  

        }  

        if (!xmlHttp) {  

            window.alert("不能创建XMLHttpRequest对象实例");  

            return false;  

        }  

        else  

            return xmlHttp;  

        ////}///////花括号放错地方  

    }  

   

 // 检查账号,给出提示信息  

    function checkNumber(Number) {  

        var numberSpan = document.getElementById("numberSpan");  

          

        if (Number.value == "") {  

            numberSpan.innerHTML = "账号必须填写".fontcolor("red");  

            return false;  

        } else {  

              

         xmlHttp = createXMLHttpRequest(); //createXMLHttpRequest申明的是局部变量,这里访问不到xmlHttp,要给xmlHttp变量赋值才行  

        var url="servlet/CheckNumberServlet?number="+Number.value+"&LoginTime="+new Date().getTime();   

        url = encodeURI(url);  //转换码后再传输   

        xmlHttp.open("GET",url,true);//加时间戳防止IE缓存  

        //xmlhttp.setRequestHeader( "Content-Type", "text/html;charset=UTF-8" );  

        xmlHttp.onreadystatechange = handleStateChange1;  

        xmlHttp.send(null);  

        return true;  

        }  

    }  

   

    function handleStateChange1() {  

        var numberSpan = document.getElementById("numberSpan");  

          

        if (xmlHttp.readyState == 4) {  

            if (xmlHttp.status == 200) {  

               // alert("来自服务器的响应:"+xmlHttp.responseText);     

               if (xmlHttp.responseText == 'true') {///////responseText是字符串,不能和boolean变量直接比较  

                  // alert("存在");     

                   numberSpan.innerHTML = "<img src='Img/g.gif'>";  

                    document.getElementById("feedback_info").innerHTML="";  

                    return true;  

                }  

                else if (xmlHttp.responseText == 'false') {///////responseText是字符串,不能和boolean变量直接比较  

                 // alert("不存在");     

                    numberSpan.innerHTML = "账号不存在".fontcolor("red");  

                    return false;  

                }  

                 

            }  

            else alert("服务器端错误");  

        }  

    }  

 // 检查密码,给出提示信息  

    function checkPsw(pswNode) {  

        var spanNode1 = document.getElementById("pswSpan");  

        var Role= document.getElementById("role");  

        var Number= document.getElementById("number");  

        if (pswNode.value == "") {  

            spanNode1.innerHTML = "密码必须填写".fontcolor("red");  

            return false;  

        } else {  

              

             pwdSpan.innerHTML = "<img src='Img/g.gif'>";  

            document.getElementById("feedback_info").innerHTML="";  

            return true;  

            }  

        }  

      

    // 检查是否选中角色  

    function checkRole(selNode) {  

        var index = selNode.selectedIndex;// 获得选中下标  

        var spanNode1 = document.getElementById("roleSpan");  

        if (index <= 0) {  

            spanNode1.innerHTML = "必须选择角色".fontcolor("red");  

            return false;  

        } else {  

            spanNode1.innerHTML = "<img src='Img/g.gif'>";  

            document.getElementById("feedback_info").innerHTML="";  

            return true;  

        }  

    }  

    // 检查表单  

    function checkLogin(o) {  

          

        var Role=o.role;  

        var Number= o.number;  

        var Pwd= o.pwd;  

        if(checkNumber(Number)&&checkPsw(Psw) &&checkRole(Role))  

            {  

         xmlHttp = createXMLHttpRequest(); //createXMLHttpRequest申明的是局部变量,这里访问不到xmlHttp,要给xmlHttp变量赋值才行  

        var url="servlet/CheckLoginServlet?number="+Number.value+"&role="+Role.value+"&pwd="+Pwd.value+"&LoginTime="+new Date().getTime();   

        url = encodeURI(url);  //转换码后再传输   

        xmlHttp.open("GET",url,true);//加时间戳防止IE缓存  

        //xmlhttp.setRequestHeader( "Content-Type", "text/html;charset=UTF-8" );  

        xmlHttp.onreadystatechange = handleStateChange2;  

        xmlHttp.send(null);  

        return true;  

            }  

        else{  

            document.getElementById("feedback_info").innerHTML="请填写每一项".fontcolor("red");  

            return false;  

        }  

    }  

    function handleStateChange2() {  

        if (xmlHttp.readyState == 4) {  

            if (xmlHttp.status == 200) {  

               //alert("来自服务器的响应:" + xmlHttp.responseText);     

                if(xmlHttp.responseText == '0'){  

                    document.getElementById("feedback_info").innerHTML="账号与密码不匹配".fontcolor("red");  

                    return false;  

                }  

                else if(xmlHttp.responseText == '1'){  

                      

                    document.getElementById("feedback_info").innerHTML="";  

                    window.location.href="index.jsp";  

                    return true;  

                }  

            }  

            else alert("服务器端错误");  

        }  

    }  

chuckLoginservlet 

Java代码  



public void doGet(HttpServletRequest request, HttpServletResponse response)  

  

    throws ServletException, IOException {  

        response.setContentType("text/html");  

        doPost(request, response);// 调用doPost方法  

    }  

  

    public void doPost(HttpServletRequest request, HttpServletResponse response)  

            throws ServletException, IOException {  

        request.setCharacterEncoding("utf-8");  

        response.setContentType("text/html;charset=UTF-8");  

  

        String number="";  

        try {  

            number = new String(request.getParameter("number").getBytes(  

                    "ISO-8859-1"), "UTF-8");  

        } catch (Exception e1) {  

            System.out.println("number为空");  

        }  

          

        String role="0";  

        int rID=0;  

        try {  

            role = new String(request.getParameter("role").getBytes(  

                    "ISO-8859-1"), "UTF-8");  

            rID=Integer.parseInt(role);//把获得的role的值转成整型  

        } catch (Exception e1) {  

            System.out.println(request.getParameter("role")+"******role");  

        }  

          

        String pwd="";  

        try {  

            pwd = new String(request.getParameter("pwd").getBytes(  

                    "ISO-8859-1"), "UTF-8");  

        } catch (Exception e) {  

  

         System.out.println(request.getParameter("pwd")+"****pwd");  

        }  

        // String txt = new String(number.getBytes("ISO-8859-1"), "UTF-8");  

        // System.out.println(txt+"********");  

        PrintWriter out = response.getWriter();  

        User u = new User();  

        UserDao ud = new UserDaoImpl();  

        u = ud.findUserByNumber(number);//通过账号找到用户对象  

  

        if (u != null) {// 找到该用户  

          

                int u_id = u.getU_id();// 获得该用户的ID  

                UserRole ur = new UserRole();  

                UserRoleDao urd = new UserRoleDaoImpl();  

                ur = urd.findUserRoleByUserId(u_id);// 找到中间表UserRole的记录  

                int r_id = ur.getRole().getR_id();// 由Userrole表找到Role表的相对应角色名称  

                if (r_id==rID && u.getU_password().equals(pwd))// 如果数据中的角色和密码与之对应  

                {  

                    out.write("1");//1表示验证通过  

                } else {  

                    out.write("0");//0表示密码与账号不匹配  

                }  

  

            }  

          

        out.flush();  

        out.close();  

    }  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: