7
回答
使用AJAX提交表单遇到的问题?
华为云实践训练营,热门技术免费实践!>>>   
我是在loginServlet中处理的登录过程,1、如果用户名不存在或密码错误,则用户点击提交按钮时,页面实现无刷新提交并提示错误(这一点已经实现)。2、如果用户名跟密码匹配则实现页面跳转。但是我在servlet中设置了页面跳转(代码也确实执行),页面并无跳转,还是停留在登陆界面。
      弄了半天也没弄明白,小弟初次使用AJAX,还望大家指导一下啊。谢谢。
//javascript中的响应函数
function processResponse() {
if (XMLHttpReq.readyState == 4) {
if (XMLHttpReq.status == 200) {
var res = XMLHttpReq.responseText;
document.getElementById("result").innerHTML = res;
} else {
window.alert("你请求的页面有异常");
}
}
}

//用户点击按钮时调用的函数
function userCheck() {
var username = document.loginform.username.value;
var password = document.loginform.password.value;
sendRequest("loginServlet?service=login&username=" + username
+ "&password=" + password);
}

//这是我的表单。
<form id="loginform" method="post" name="loginform">
<table>
<tr>
<td>用户名:</td>
<td>
<input name="username"id="username"></td>
</tr>
<tr>
<td>密  码:</td>
<td>
<input type="password" name="password" id="password"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="button" id="submit" value="登录"  onclick="userCheck()">
</td>
</tr>
</table>
</form>

//loginServlet中的部分代码
int result = userdao.login(user);
if(result == -1)
{
out.println("<response>");
out.println("<result>" + "用户名不存在!" + "</result>");
out.println("</response>");
out.close();
}
else if(result == 0)
{
out.println("<response>");
out.println("<result>" + "用户密码错误!" + "</result>");
out.println("</response>");
out.close();
}
else if(result == 1)
{
HttpSession session = req.getSession();
session.setAttribute("username", username);
req.getRequestDispatcher("login_success.jsp").forward(req, resp);
}
<无标签>
举报
三国vip
发帖于5年前 7回/334阅
共有7个答案 最后回答: 5年前

页面调用ajax方法:<input type="button" id="submit" value="登录"  onclick="userCheck()">

js代码:

function userCheck(){

    $.get("loginServlet?service=login&name="+$("#userName").val()+"&password="+$("#password").val(),null,function(data){
        $("#result").html(data);
    });

}

试试这么写~需要引入jquery包<script type="text/javascript" src="jquery-1.3.1.js"></script>

--- 共有 1 条评论 ---
三国vip我知道Jquery有个beforeSubmit()和afterSubmit(),我差不多就是想用这个功能,但是又不想用jquery。 5年前 回复
大概就是这个意思,没有完全按照你的代码来写,建议先学学ajax~在你的页面中加入<div id="result"></div>这句话,试试效果,也许你就明白了!
--- 共有 1 条评论 ---
三国vip这个标签我加了,而且密码错误时就是在这个标签中显示的。但问题是现在我如果用户名跟密码都正确的话,在servlet中即if(result==1)时代码执行,但是页面却不跳转。 5年前 回复

那就这样做:

后台代码改一下:

if(result == -1)
{
response.getWriter().write("用户名错误!");

}
else if(result == 0)
{
response.getWriter().write("用户密码错误");

}
else if(result == 1)
{
HttpSession session = req.getSession();
session.setAttribute("username", username);
response.getWriter().write("登录成功");

}

前台代码:在回调函数里判断一下:

if(data=="用户名错误!"){

     $("#result").html(data);

}

 

if(data=="用户密码错误!"){

     $("#result").html(data);

}

 

if(data=="登录成功!"){

     window.location="你想跳转的页面";

}

 

--- 共有 1 条评论 ---
三国vip恩,这个方法倒是可以。不过得在页面中加入判断以及跳转页面的链接,感觉不安全,正常情况下应该在后台控制页面跳转哈。不过起码解决了我的一个难题,谢谢了哈! 5年前 回复

恩 其实你封装json数据的时候,构建这样的数据类型

jsonStr={"success":"1","data":"login success!"};

jsonStr={"success":"0","data":"login failure!wrong user or password!"};


--- 共有 2 条评论 ---
三国vip不太明白,没用过json,就会简单的用js。 5年前 回复
小人物_Amor其实就应该这样做! 5年前 回复
顶部