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

时间:2019-02-12 07:30:19

标签: javascript jquery html5 jquery-validate

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

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

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

这里是Chrome: enter image description here

以下是Safari的相同形式: enter image description here

这些消息不是由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"
            }

        }
    });
});

1 个答案:

答案 0 :(得分:1)

  

我正在尝试对消息进行jquery表单验证,但我希望错误消息显示在浏览器的默认工具提示中。。

不可能

使用jQuery Validate插件时,出于明显原因,浏览器的HTML5验证被禁用。

  

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

您不能

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