jquery - 如何使用 jQuery.validate() 但依赖 native Chrome 验证警报？

Question

我正在使用 jQuery Form Validator 插件..

我有一个标记了 HTML5 必需属性的表单，类似于以下内容:

<form role="form" id="the-form">
   <input name="name" id="name" required>
</form>

我让 jQuery 验证正常:

$("#the-form").validate();

然后，单击按钮会触发有效性检查，然后再进行其他操作:

//Request Button clicked    
$("#request-btn").on("click", function() {
    if ($('#the-form').valid()){
        ...everything good... move along
    }
});

我的逻辑运行得非常完美。但是，现在我已经开始使用 jQuery 验证插件，验证警报不再通过浏览器运行。我仍在深入研究它，但我猜该插件有它自己的可以格式化的警报类。

是否有一个标志强制 jQuery 允许 native 浏览器警报弹出而不是它自己的？

新的 jQuery 验证通知打破了我在屏幕上的表单布局，而 Chrome 警报工作得非常完美。

编辑:发布此消息后，我正在检查警报，这是现在插入的内容:

<label id="name-error" class="error" for="name">This field is required.</label>

据我所知，与 Chrome 一样，由 Chrome 在应用程序级别处理。

第二次编辑 这个应用程序将特定于 Chrome，所以我不担心跨浏览器和旧版浏览器的兼容性。我实际上想让 Chrome 担心字段级别的验证，而只是使用 jQuery .valid() 在继续之前检查整个表单的有效性。

Answer 1

感谢 adaam 的回复，我能够使用 checkValidity 方法进行 HTML5 约束验证:

$('#request-btn').bind('click',function(){
    if ($('#the-form')[0].checkValidity()) {
        ...do the magic stuff here... move along...
    }
})

You could just use the HTML5 Constraint Validation API checkValidity method a la jsfiddle.net/E6jhE/5 and cut out the need for jQuery validate altogether. (I'm guessing you are working on a multi-page form using a single <form> tag if you want to check validity per stage although I could be getting the wrong end of the stick) – adaam 34 mins ago