阻止在jQuery表单上提交

时间:2016-04-03 13:32:59

标签: javascript jquery ajax login preventdefault

我使用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;
    });
});

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

2 个答案:

答案 0 :(得分:2)

你有一个异步的ajax调用,所以当你的success函数触发时,表单提交事件已经通过,所以你需要再次提交表单但是使用DOM方法,它将绕过jQuery事件处理程序并允许表单提交。

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

由于您没有说出响应表明密码正确,我使用了result == "correct",因此请相应更改。

答案 1 :(得分:-1)

只有在您不想提交表单时才需要返回false。 如果密码正确,则需要在您的情况下返回true。