ValidityState

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since December 2018.

DOM 接口 ValidityState 代表一个元素可有的有效性状态(validity states),其与约束验证(constraint validation)相关。这些状态一起解释了当元素值无效时,它的值为什么不能通过验证。

属性

对于以下每一个布尔值属性来说,值为 true 表示这就是验证失败的特定原因之一;valid 属性是例外,它为 true 表示元素值满足所有的约束条件。

badInput 只读

一个 Booleantrue 表示用户提供了浏览器不能转换的输入。

customError 只读

一个 Boolean,表示这个元素的自定义验证信息是否已通过调用元素的 setCustomValidity() 方法设置为一个非空字符串。

patternMismatch 只读

一个 Booleantrue 表示元素值不匹配规定的patternfalse 则表示匹配。true 的时候元素可用 CSS 伪类 :invalid 匹配。

rangeOverflow 只读

一个 Booleantrue 表示值已超过 max 属性规定的最大值,false 则表示小于或等于这个最大值。true 的时候元素可用 CSS 伪类 :invalid:out-of-range 匹配。

rangeUnderflow 只读

一个 Booleantrue 表示值小于 min 属性规定的最小值,false 则表示大于或等于这个最小值。true 的时候元素可用 CSS 伪类 :invalid:out-of-range 匹配。

stepMismatch 只读

一个 Booleantrue 表示值不符合由 step 属性规定的规则(即该值不能被步长值除尽,译注:假设最小值是 0)。false 表示其符合步长值规则。true 的时候元素可用 CSS 伪类 :invalid:out-of-range 匹配。

tooLong 只读

一个 Booleantrue 表示值超过了HTMLInputElementHTMLTextAreaElement 对象中规定的 maxlengthfalse 表示值的长度小于或等于最大长度。注意:这个属性在 Gecko 中永远不会是 true,因为元素值不允许比 maxlength 长。true 的时候元素可用 CSS 伪类 :invalid:out-of-range 匹配。

tooShort 只读

一个 Booleantrue 表示值的长度小于 HTMLInputElementHTMLTextAreaElement 对象中规定的 minlengthfalse 表示值的长度大于或等于最大长度。true 的时候元素可用 CSS 伪类 :invalid:out-of-range 匹配。

typeMismatch 只读

一个 Booleantrue 表示元素值不满足所需的格式(可见于 typeemailurl 时),false 表示格式正确。true 的时候元素可用 CSS 伪类 :invalid 匹配。

valid 只读

一个 Booleantrue 表示元素满足所有的验证约束,因此被认为时有效的,false 表示有任一约束不满足。true 的时候元素可用 CSS 伪类 :valid 匹配,否则可用 CSS 伪类 :invalid 匹配。

valueMissing 只读

一个 Booleantrue 表示元素拥有 required 属性,但没有值,否则为 falsetrue 的时候元素可用 CSS 伪类 :invalid 匹配。

规范

Specification
HTML Standard
# the-constraint-validation-api:validitystate-3

浏览器兼容性

BCD tables only load in the browser

参见