如何更改或删除HTML5表单验证默认错误消息？

Question

例如，我有一个textfield。该字段是必填字段，只需要数字，值的长度必须为10。当我尝试提交长度为5的表单时，会出现默认错误消息：请匹配请求的格式

<input type="text" required="" pattern="[0-9]{10}" value="">

1. 如何更改超文本标记语言5表单验证错误默认消息？
2. 如果第一点可以做到，那么是否有一种方法来创建一些属性文件并在该文件中设置自定义错误消息？

Answer 1

<input type="text" pattern="[a-zA-Z]+"
oninvalid="setCustomValidity('Plz enter on Alphabets ')" />

我在另一个帖子里发现了这个代码。

Answer 2

当使用pattern=时，它将显示您在标题attrib中输入的内容，因此不需要JS，只需执行以下操作：

<input type="text" required="" pattern="[0-9]{10}" value="" title="This is an error message" />

Answer 3

这是JavaScript解决方案：

 <input type="text"
    pattern="[a-zA-Z]+"
    oninvalid="setCustomValidity('Please enter Alphabets.')"
    onchange="try{setCustomValidity('')}catch(e){}" />

当您设置无效的输入数据时，“onChange”事件需要，然后更正输入并再次发送表单。我已经在火狐、Chrome和Safari上测试过了。

但对于现代浏览器：

现代浏览器不需要任何JavaScript进行验证。就这样做吧：

<input type="text"
    pattern="[a-zA-Z]+"
    title="Please enter Alphabets."
    required="" />