Question

所以我有一个非常基本的帐户注册表。提交表单工作正常，输入字段的验证也是如此。什么不起作用，是在输入不正确时阻止提交。

<form id="register">
    <input id="username" name="username" minlength="3">
    <input id="activate" type="button" value="activate">
</form>

<script>
$().ready(function(){
    $("#register").validate({
        rules: { username: "required" },
        messages: { username: "Please enter a Username }
    });
});

$("#activate").click(function(){
    var username = $("#username").val();

    $.ajax({
        type: "POST",
        url: "validateuser.php",
        data: { username: username }
    }).done(function(data){
    console.log(data);
    });
});
</script>

所以这是我的代码的简化示例。我知道它现在不能正常工作，因为.click函数与validate()无关。但我无法弄清楚如何“结合”这两个功能。 validate.js确实将classes的{{1}}更改为inputs，因此我可能会检查valid/invalid函数。但必须有一个更优雅的解决方案。

当我使用库时，我总是很困惑，因为我不知道他们如何与“常规”jQuery交互。另外值得一提的是，我对jQuery很新，只是开始掌握它。

我非常感谢有关此事的任何意见。

Answer 1

使用提交处理程序。因为您在单击activate按钮时启动ajax，这是一个与验证功能不同的功能。因此，它将被称为绕过/忽略验证错误。所以在jquery验证函数中使用submitHandler。

<script>
$().ready(function(){
    $("#register").validate({
        rules: { username: "required" },
        messages: { username: "Please enter a Username },
        submitHandler:function(){    // Use submitHandler
            var username = $("#username").val();

            $.ajax({
            type: "POST",
            url: "validateuser.php",
            data: { username: username }
                    }).done(function(data){
                    console.log(data);
                });
            }
    });
});

</script>

ajax表单提交按钮忽略验证

1 个答案: