.submit()函数在ajax()函数中不起作用

.submit() function not working inside ajax() function

本文关键字:函数 不起作用 submit ajax      更新时间:2023-09-26

我是ajax新手。这个要求相当简单。当提交按钮被按下时,javascript将执行异步请求,服务器端将验证用户输入。如果输入正确,则表单将执行标准提交,否则显示错误消息。

这是我的表单:

<form id="form" action="dosomething.jsp" method="post">
  <input type="text" name="name">
  <input type="text" name="email">
<input id="submit" type="submit" value="Go">
</form>

这是我的javascript:

$(document).ready(function() {
    $("#form").submit(function(event) { 
        event.preventDefault();
        var form = $(this);
        var button =  $("#submit");
        button.attr("disabled", "disabled");
        $.ajax({
            url: "ValidateServlet",
            type: "post",
            data: form.serialize(),
            success: function(msg) {
                if(msg== ""){
                    form.unbind("submit");
                    form.submit();
                } else{
                alert(msg);
                button.removeAttr("disabled");
                }
            }
        });
    });
});

代码工作正常,除了一个函数form.submit();不工作。我在ajax()函数之外尝试这个,它会提交,所以我认为范围有问题,但我无法修复。

让我澄清form.unbind();。假设我删除了form.submit();的行,换句话说,对于成功案例(if(msg = "")),只有form.unbind();。当我第一次按下提交按钮时,表单将像往常一样执行异步请求进行验证。如果输入正确(即msg = ""),当我再次按下提交按钮时,它将执行标准提交,因为我已经解除了提交事件的绑定。因此,问题不在于form.unbind();,至少在我看来是这样。

servlet代码:
public void doPost(HttpServletRequest request,HttpServletResponse response) 
            throws ServletException, IOException{
    PrintWriter out = response.getWriter();
    String msg = "";
    String name = request.getParameter("name");
    String email = request.getParameter("email");
    if("".equals(name)){
        msg += "<li>Please enter name</li>" ;
    }
    if("".equals(email)){
        msg += "<li>Please enter email</li>" ;
    }
    if(title.length() > 20 ){
        msg += "<li>Name should be lesser than 20 character.</li>" ;
    }
    if(email.length() > 30){
        msg += "<li>Title should be lesser than 30 character.</li>" ;
    }
    if(! "".equals(msg)){
        msg = "<p>Error :</p><ul>" + msg;
        msg += "</ul>";
        out.print(msg);
    } 
    out.close();
}

您是否尝试过使用$.on()和$.off()来绑定您的事件?

之类的
$(document).ready(function() {
    $("#form").on('submit',function(event) { 
        event.preventDefault();
        var frm = $(this);
        var btn =  $("#submit");
        button.attr("disabled", "disabled");
        $.ajax({
            url: "ValidateServlet",
            type: "post",
            data: frm.serialize(),
            success: function(msg) {
                if(msg== ""){
                    frm.off("submit");
                    frm[0].submit();
                } else{
                alert(msg);
                btn.removeAttr("disabled");
                }
            }
        });
    });
});

我也尽量避免使用'form'作为变量名