HTML设置自定义验证错误消息

Question

我想验证我的输入字段是否为数字

<input...type="number" step="1"...>

这很好用，但是表格警告我输入不是有效数字，而我想显示“仅允许数字”之类的内容

我可以自定义消息吗？ 样式应与我的其他验证消息相同，而不是其他弹出窗口或类似内容

Answer 1

就目前而言，唯一实现一致的方法是通过JavaScript使用setCustomValidity() 函数 ：

<input...type="number" step="1" oninvalid="setCustomValidity('Only digits allowed')" oninput="setCustomValidity('')" />

一些浏览器已经实现了自己的自定义属性 ，但是还不可靠。

的jsfiddle

HTML5Rocks对浏览器支持和此功能的陷阱进行了深入分析 。