Javascript 阻止提交的事件处理程序

下面有一段非常简单的代码，它在confirmPass击键时安装一个事件处理程序。在注册表提交时，如果密码不匹配，我希望能够禁用提交。在注册表的“onClick”事件中，如果我调用confirmPass（），它将无法提交，如果我对它进行注释，它将提交。为什么confirmPass（）会阻止编程表单提交

$( document ).ready(function() {
    console.log( "ready!" );
    $('#confirmPassword').keyup(function(){
        confirmPass();
    })
});
function registrationSubmit(){
    confirmPass();
    $('#registration').submit();
}
function confirmPass() {
    var pass = $('#password').val();
    var cpass = $('#confirmPassword').val();
    if (!(pass == cpass)) {
        $('#confirmPassword').addClass('text-danger');
        $('#cpassmsg').addClass('text-danger').removeClass('ui-helper-hidden');
        $('#cpassmsg').text("Confirm Password Fails")
        $('#registration').submit(function (event) {
            event.preventDefault();
        });
        return;
    } else {
        $('#confirmPassword').addClass('text-success').removeClass('text-danger');
        $('#cpassmsg').addClass('text-success').removeClass('text-danger');
        $('#cpassmsg').text("Confirm Password Match!")
    }

---

您永远不会删除调用

preventDefault（）

的提交处理程序

不要在

confirmPass（）

中添加处理程序，而是在

registrationSubmit（）

中检查密码是否有效。Have

confirmPass（）

返回一个布尔值来指示这一点

$（文档）.ready（函数（）{
console.log（“准备就绪！”）；
$（'#confirmPassword'）.keyup（函数（）{
confirmPass（）；
})
});
函数注册submit（）{
if（confirmPass（））
$（“#注册”）.submit（）；
}
}
函数confirmPass（）{
var pass=$（'#password'）.val（）；
var cpass=$（'confirmPassword'）.val（）；
如果（通过！=cpass）{
$（'confirmPassword'）.addClass（'text-danger'）；
$（'#cpassmsg'）.addClass（'text-danger'）.removeClass（'ui-helper-hidden'）；
$（'#cpassmsg'）.text（“确认密码失败”）
返回false；
}否则{
$（'confirmPassword'）.addClass（'text-success'）.removeClass（'text-danger'）；
$（'#cpassmsg'）.addClass（'text-success'）.removeClass（'text-danger'）；
$（'#cpassmsg'）.text（“确认密码匹配！”）；
返回true；
}
}

您永远不会删除调用

preventDefault（）

的提交处理程序

不要在

confirmPass（）

中添加处理程序，而是在

registrationSubmit（）

中检查密码是否有效。Have

confirmPass（）

返回一个布尔值来指示这一点

$（文档）.ready（函数（）{
console.log（“准备就绪！”）；
$（'#confirmPassword'）.keyup（函数（）{
confirmPass（）；
})
});
函数注册submit（）{
if（confirmPass（））
$（“#注册”）.submit（）；
}
}
函数confirmPass（）{
var pass=$（'#password'）.val（）；
var cpass=$（'confirmPassword'）.val（）；
如果（通过！=cpass）{
$（'confirmPassword'）.addClass（'text-danger'）；
$（'#cpassmsg'）.addClass（'text-danger'）.removeClass（'ui-helper-hidden'）；
$（'#cpassmsg'）.text（“确认密码失败”）
返回false；
}否则{
$（'confirmPassword'）.addClass（'text-success'）.removeClass（'text-danger'）；
$（'#cpassmsg'）.addClass（'text-success'）.removeClass（'text-danger'）；
$（'#cpassmsg'）.text（“确认密码匹配！”）；
返回true；
}
}

此行添加事件处理程序

$('#registration').submit(function (event) {
            event.preventDefault();
        });

这意味着每次在命中此行后触发submit事件时，它都将被取消。由于在每次击键时调用

confirmPass

，该行将至少执行一次，因此表单上的提交事件将始终被取消。相反，您可能只想在验证成功的情况下调用submit并删除我上面提到的行

例

function registrationSubmit(event){
    // Assuming you modify confirmPass to return true/false
    if(confirmPass()){
       $('#registration').submit();
    }
 }

---

此行添加一个事件处理程序

$('#registration').submit(function (event) {
            event.preventDefault();
        });

这意味着每次在命中此行后触发submit事件时，它都将被取消。由于在每次击键时调用

confirmPass

，该行将至少执行一次，因此表单上的提交事件将始终被取消。相反，您可能只想在验证成功的情况下调用submit并删除我上面提到的行

例

function registrationSubmit(event){
    // Assuming you modify confirmPass to return true/false
    if(confirmPass()){
       $('#registration').submit();
    }
 }

---

每次确认失败时，您都会添加一个调用

preventDefault（）

的事件侦听器。当确认成功时，您永远不会删除它们。每次确认失败时，您都会添加一个调用

preventDefault（）

的事件侦听器。当确认成功时，您永远不会删除这些。