Javascript 将HTML5验证消息与jQuery验证插件一起使用

我有一个相对简单的表单，需要有条件地提交，如果HTML5验证未通过，则显示验证消息

我正在使用jqueryvalidate，这看起来不错，但我想要的只是

if( $('#myForm').valid()) {...}

jqueryvalidate似乎决定将错误消息放在DOM中，并阻止浏览器的本地消息，这是我不希望看到的。我不知道我是瞎了还是哑了（可能两者都是），但我不知道如何阻止它这样做

这就是我现在拥有的：

// call validate to set the form up for validation
$(this).closest('form').validate();

if ($(this).closest('form').valid()) {
    // do some stuff
} else {
    // show error messages via the browser (need to pretend to click a button for this)
    $(this).closest('form').find(':submit').click();
}

---

在使用jQuery验证插件的同时，任何人都不应该希望进行HTML5验证

该插件通过在

表单

中添加

novalidate

属性来动态禁用所有HTML5验证，如果不修改源代码，您将无能为力

我想您可以利用jQuery从

元素中删除

novalidate

属性。请确保在调用

.validate（）

后执行此操作

$('#myform').removeAttr('novalidate');

但是，插件将不会与错误消息有任何连接，HTML5消息的行为将独立于插件

您还可以使用

errorPlacement

选项覆盖默认的消息放置行为，该行为使插件保持运行，但会完全抑制错误消息

$('#myform').validate({
    errorPlacement: function() {
        return false;
    }
});

您无法克服的最后一个障碍是，jQuery验证插件一旦初始化，就不能被禁用或打开/关闭

---

引用OP：

“但我想要的只是

if（$（'#myForm'）.valid（））

的功能。”

您已经知道，

.valid（）

方法是jQuery验证插件的一部分。因此，如果不使用jQuery验证插件，就无法使用它。换句话说，您不能使用此方法测试HTML5验证。另外，没有可用的JavaScript方法手动触发或测试带有HTML5验证的表单。HTML5验证只是内置在浏览器中，并由HTML5属性控制。。。它非常简单，不是JavaScript。通常，如果您需要比浏览器提供的更复杂的客户端控制，您可以使用JavaScript。因此，在本例中，只需使用jQuery验证即可。无论它做了什么你不喜欢的事情，你都需要使用jQuery技术来克服，而不是HTML5

引用OP：

“jQuery Validate似乎决定将错误消息放在DOM中，并阻止浏览器的本机消息，这是我不希望看到的。”

是的，它决定阻止浏览器的HTML5错误消息，因为您已经安装了jQuery插件来处理验证。如果您希望有HTML5验证消息，那么就不应该使用jQuery验证插件。如果您真的不想进行DOM操作，那么就不应该使用jQuery，因为这是它的主要用途之一。这大致类似于说你不想用电，但你还是想让电灯泡亮起来

---

如果您只是想让错误消息更具吸引力，那么我建议您使用类似jQuery验证插件的jQuery插件，或者与jQuery验证插件正确集成，而不是将HTML 5和jQuery进行复杂的条件混搭

演示：

---

---

记住，jQuery验证将在比HTML5验证多得多的浏览器版本中正常且更一致地工作，这完全取决于每个浏览器如何处理/设置其HTML 5验证消息的样式。

在使用jQuery验证插件的同时，没有任何人希望执行HTML 5验证的逻辑原因

该插件通过在

表单

中添加

novalidate

属性来动态禁用所有HTML5验证，如果不修改源代码，您将无能为力

我想您可以利用jQuery从

元素中删除

novalidate

属性。请确保在调用

.validate（）

后执行此操作

$('#myform').removeAttr('novalidate');

但是，插件将不会与错误消息有任何连接，HTML5消息的行为将独立于插件

您还可以使用

errorPlacement

选项覆盖默认的消息放置行为，该行为使插件保持运行，但会完全抑制错误消息

$('#myform').validate({
    errorPlacement: function() {
        return false;
    }
});

您无法克服的最后一个障碍是，jQuery验证插件一旦初始化，就不能被禁用或打开/关闭

---

引用OP：

“但我想要的只是

if（$（'#myForm'）.valid（））

的功能。”

您已经知道，

.valid（）

方法是jQuery验证插件的一部分。因此，如果不使用jQuery验证插件，就无法使用它。换句话说，您不能使用此方法测试HTML5验证。另外，没有可用的JavaScript方法手动触发或测试带有HTML5验证的表单。HTML5验证只是内置在浏览器中，并由HTML5属性控制。。。它非常简单，不是JavaScript。通常，如果您需要比浏览器提供的更复杂的客户端控制，您可以使用JavaScript。因此，在本例中，只需使用jQuery验证即可。无论它做了什么你不喜欢的事情，你都需要使用jQuery技术来克服，而不是HTML5

引用OP：

“jQuery Validate似乎决定将错误消息放在DOM中，并阻止浏览器的本机消息，这是我不希望看到的。”

是的，它决定阻止浏览器的HTML5错误消息，因为您已经安装了jQuery插件来处理验证。如果您希望进行HTML5验证