<input type="text" id="input" pattern="[0-9]" required oninvalid="alert('yes,invalid')"> <button onclick="alert(document.getElementById('input').checkValidity())">Check</button>
一切都按预期工作，从checkValidity返回正确的值，并发送和显示无效事件，但是如何以编程方式显示验证错误泡泡？
请看ScottR对这个答案的评论。
…然后我的测试显示，Firefox和Chrome在调用< form>中包含的元素上调用checkValidity时显示它。 (testcase)，但不是独立元素(testcase)。
当没有表单时，似乎没有显示它的机制，并且规范doesn’t even say必须显示以响应程序化checkValidity调用(在元素或表单上) – 只有在提交表单时。
所以现在，把你的元素包装成一个表单，即使你不会真的提交它。
更好的是，使用您自己的验证UI，这将防止您在此不明确区域的浏览器中的将来更改。
