javascript - 防止在 jQuery 表单上提交

Question

我正在使用 jQuery 和 ajax 在登录表单上设置密码控件。
到目前为止，这是脚本

$(document).ready(function() {
    $("#login-form").submit(function(e) {
        var csrftoken = getCookie('csrftoken');
        var password = $('#login-password').val();
        var email = $('#login-email').val();

        $.ajax({
            url: "/password_check/",
            type: "POST",
            dataType: "json",
            data : {
                csrfmiddlewaretoken: csrftoken,
                password: password,
                email: email
            },
            success: function(result) {
                document.getElementById("login-error").innerHTML = result.response;
                event.preventDefault();
            }
        });
        return false;
    });
});

这样，在触发提交按钮时就会捕获错误，但如果密码正确，则提交将不起作用(即使错误不再显示)。
我错过了什么？

Answer 1

您有一个异步ajax调用，因此当您的success函数触发时，表单提交事件已经过去，因此您需要再次提交表单，但使用DOM方法，这将绕过jQuery 事件处理程序并允许表单提交。

success: function(result) {
    if(result == "correct"){
        document.getElementById("login-form").submit();
    } else {
        document.getElementById("login-error").innerHTML = result.response;
    }
}

由于您没有说明什么响应表明密码正确，因此我使用了result ==“正确”，因此请相应地进行更改。