如何在不通过 jQuery 提交的情况下强制进行 html5 表单验证

Question

我的应用程序中有此表单，我将通过 AJAX 提交它，但我想使用 HTML5 进行客户端验证。所以我希望能够强制执行表单验证，也许是通过 jQuery。

我想在不提交表单的情况下触发验证。可能吗？

原文由 razenha 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

要检查某个字段是否有效，请使用：

 $('#myField')[0].checkValidity(); // returns true|false

要检查表单是否有效，请使用：

 $('#myForm')[0].checkValidity(); // returns true|false

如果您想显示某些浏览器（例如 Chrome）的本机错误消息，不幸的是，唯一的方法是提交表单，如下所示：

 var $myForm = $('#myForm');

if (!$myForm[0].checkValidity()) {
    // If the form is invalid, submit it. The form won't actually submit;
    // this will just cause the browser to display the native HTML5 error messages.
    $myForm.find(':submit').click();
}

请记住，到目前为止，并非所有浏览器都支持 HTML5 验证。

原文由 Abraham 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

下面的代码对我有用，

 $("#btn").click(function () {

    if ($("#frm")[0].checkValidity())
        alert('sucess');
    else
        //Validate Form
        $("#frm")[0].reportValidity()

});

原文由 Boopathi.Indotnet 发布，翻译遵循 CC BY-SA 4.0 许可协议