ValidityState - 表示约束验证对应的元素的 “有效性状态”
ValidityState 接口表示约束验证对应的元素的 “有效性状态”。它们解释了一个元素的值无效(如果它无效)的原因。
属性
对于下面的布尔属性,如果元素的值遵循所有约束,则 valid 属性为 true。其他属性值为 true 表示指定的验证失败。
badInput 只读
一个 Boolean,如果用户提供了浏览器无法转换的输入,则为 true。
customError 只读
一个 Boolean 方法,表示是否通过调用元素的 setCustomValidity() 方法将元素的自定义有效性消息设置为非空字符串。
patternMismatch 只读
一个 Boolean,如果该值与指定的 pattern 不匹配,则为 true;如果匹配,则为 false。如果为 true,则元素与 :invalid CSS 伪类匹配。
rangeOverflow 只读
一个 Boolean,如果该值大于 max 属性指定的最大值,则为 true;如果小于该值或等于最大值,则为 false。如果为 true,则该元素与 :invalid 和 :out-of-range CSS 伪类匹配。
rangeUnderflow 只读
一个 Boolean,如果该值小于 min 属性指定的最小值,则为 true;否则大于或等于最小值,为 false 。如果为 true,则元素与 :invalid 和 :out-of-range CSS 伪类匹配。
stepMismatch 只读
一个 Boolean,如果该值不符合 step 属性所确定的规则,则为 true(也就是说,它不能被整除按步长值),如果符合步长规则,则为 false。如果为 true,则元素与 :invalid 和 :out-of-range CSS 伪类匹配。
tooLong 只读
一个 Boolean,如果该值超过 HTMLInputElement 或 HTMLTextAreaElement 对象指的 maxlength,则为 true,或者如果其长度小于或等于最大长度,则返回 false。如果为 true,则元素与 :invalid 和 :out-of-range CSS 伪类匹配。
注意: 在 Gecko 中,此属性永远不会为
true,因为浏览器会阻止元素的值大于maxlength。
tooShort 只读
一个 Boolean,如果该值不能满足 HTMLInputElement 或 HTMLTextAreaElement 对象的指定 minlength,则为 true,如果长度大于或等于最小长度,则返回 false。如果为 true,则元素与 :invalid 和 :out-of-range CSS 伪类匹配。
typeMismatch 只读
一个 Boolean,如果值不符合要求的语法(当 {{htmlattrref("type","input")}} 为 true 或 email 时),则为 true。如果语法正确,则返回 false。如果为 true,则元素与 :invalid CSS 伪类匹配。
valid 只读
一个 Boolean,如果元素满足其所有验证约束,则为 true,因此被视为有效;如果不满足,则为 false。如果为 true,则元素与 :valid CSS 伪类匹配;否则为 false。否则,与 :invalid CSS 伪类匹配。
valueMissing 只读
一个 Boolean,如果元素具有 required 属性但没有值,则为 true,否则为 false。如果为 true,则元素与 :invalid CSS 伪类匹配。
规范
| 规范 | 状态 | 备注 |
|---|---|---|
| HTML Living Standard ValidityState 的定义 |
现行的标准 | 现行的标准 |
| HTML 5.1 ValidityState 的定义 |
推荐 | 与之前的快照 HTML5 相同。 |
| HTML5 ValidityState 的定义 |
推荐 | 包含此接口的 HTML Living Standard 的第个快照。 |
桌面浏览器兼容性
| 特性 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基础支持 | 15 | 12 | 4 | 10 | 12.1 | 11 |
badInput | 25 | 14 | 29 | 不支持 | 15 | 11 |
tooLong | 15 | 121 | 41 | 10 | 15 | 11 |
tooShort | 40 | 17 | 51 | 不支持 | 27 | 11 |
移动浏览器兼容性
| 特性 | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
|---|---|---|---|---|---|---|---|
| 基础支持 | 4 | 支持 | 未知 | 64 | 未知 | 12.1 | 5 |
badInput | 4.4 | 支持 | 未知 | 64 | 未知 | 14 | 7 |
tooLong | 4 | 支持 | 未知 | 64 | 未知 | 14 | 5 |
tooShort | 67 | 支持 | 未知 | 64 | 未知 | 27 | 10 |
1. 在极少数情况下不支持该值,该值最初设置得太长,然后由用户更改为仍然不正确的状态。参照 caniuse.com。