custom/override 浏览器提供的错误信息？

Question

有没有办法覆盖浏览器提供的错误信息？ 我有一个简单的 html:

<input type="email" name="recipient">

如果电子邮件格式不正确，浏览器将显示如下消息：

在 Firefox 中：

Please enter a email address.

在 Chrome 中：

Please include an @ in the email address... 

我想自定义这个浏览器提供的错误信息，希望有人能帮我解决这个问题。 提前致谢！

Answer 1

您可以像这样设置自定义有效性消息

$('[name="recipient"]').on('invalid', function(e) {
    e.target.setCustomValidity("This is a custom error message");
});

FIDDLE