HTML5 中是否有与 Web 浏览器表单验证相关的 JavaScript 属性？答案

【问题标题】：Are there any JavaScript properties related to web browser form validation in HTML5?HTML5 中是否有与 Web 浏览器表单验证相关的 JavaScript 属性？
【发布时间】：2011-05-04 23:18:21
【问题描述】：

在 HTML5 中，客户端验证应该成为 Web 浏览器的一项工作，通过 pattern 或 required 等属性。

是否只有 CSS 实现（即 :valid 和 :invalid 选择器，用于向用户提供反馈）还是还有 JavaScript 实现？

我正在考虑一种功能，如果用户单击提交并且表单中包含无效值，则允许调用 JavaScript 函数。或者我可以在表单对象中访问的标志，以显示它是否有错误。

谢谢。

【问题讨论】：

主观和争论。我想你想要programmer.stackexchange.com
@apphacker：真的吗？在我看来，问题是是否可以通过 JavaScript 访问浏览器验证的结果。这不是争论，而是询问是否存在能力。

标签： javascript validation forms html

【解决方案1】：

是的，它确实有效，并且目前有效。请参阅 A List Apart's Ryan Seddon 撰写的关于该主题的优秀文章。根据文章，Chrome 4+、Safari 5+ 和 Opera 9.6+ 都支持这些属性。（他还包括an example。）

从文章中引用，您可以执行以下操作：

input:focus:required:invalid {
  background: pink url(ico_validation.png) 379px 3px no-repeat;
}
input:required:valid {
  background-color: #fff;
  background-position: 379px -61px;
}

当输入验证时，它会显示一个图标，当它无效并获得焦点时，它会显示另一个。

【讨论】：

【解决方案2】：

是的，您可以查询validity 属性。见http://dev.w3.org/html5/spec/association-of-controls-and-forms.html#dom-cva-validity

我不知道目前在浏览器中有多少支持。

【讨论】：