javascript - 使用 jquery 验证表单时使用默认浏览器消息

Question

我正在尝试对消息进行 jquery 表单验证，但我希望错误消息显示在浏览器的默认工具提示中，例如当您使用电子邮件类型或将 required 添加到这样的输入时:

<input type="email" class="email" id='email' name='email' placeholder="EMAIL" required>

我不想安装第三方工具提示库，我只想使用默认浏览器的系统。

这是 Chrome:

这是相同表单的 Safari:

这些消息不是由 jquery 创建的，而是由浏览器创建的。有没有办法可以将我的验证消息重定向到浏览器使用的系统？这是我的 jquery:

$(document).ready(function(){
    $('#login-form').validate({
        rules: {
            login_email: {
                required: true,
                minlength: 7
            },
            login_password: {
                required: true,
                minlength: 8
            }
        },
        messages: {
            login_email: {
                required: "Email is required to login",
                minlength: "Email must contain at least {0} characters"
            },
            login_password: {
                required: "A password is required to login",
                minlength: "Password must contain at least {0} characters"
            }

        }
    });
});

Answer 1

I am trying to do jquery form validation with messages but I want the error message to show up in the browsers default tooltips...

不可能。

当使用 jQuery Validate 插件时，浏览器的 HTML5 验证因显而易见的原因被禁用。

I do not want to install a third party tooltip library, I just want to use the default browser's system.

你不能。

jQuery Validate 自动禁用 HTML5 验证。您可以通过自己的代码或插件使用带或不带弹出工具提示的 jQuery Validate，或者使用浏览器提供的 HTML5 验证。你不能两者兼顾。