initial commit

1 files changed, 88 insertions, 0 deletions

diff --git a/files/zh-cn/web/api/validitystate/index.html b/files/zh-cn/web/api/validitystate/index.html
new file mode 100644
index 0000000000..4fc6e0d3ef
--- /dev/null
+++ b/files/zh-cn/web/api/validitystate/index.html
@@ -0,0 +1,88 @@
+---
+title: ValidityState
+slug: Web/API/ValidityState
+tags:
+  - API
+  - HTML DOM
+  - 接口
+  - 表单
+  - 输入
+translation_of: Web/API/ValidityState
+---
+<div>{{APIRef("HTML DOM")}} {{gecko_minversion_header("2.0")}}</div>
+
+<p>DOM接口 <code>ValidityState</code> 代表一个元素可有的有效性状态（<em>validity states</em>），其与约束验证（constraint validation）相关。这些状态一起解释了当元素值无效时，它的值为什么不能通过验证。</p>
+
+<h2 id="属性">属性</h2>
+
+<p>对于以下每一个布尔值属性来说，值为 <code>true</code> 表示这就是验证失败的特定原因之一；<strong>valid </strong>属性是例外，它为 <code>true</code> 表示元素值满足所有的约束条件。</p>
+
+<dl>
+ <dt>{{domxref("ValidityState.badInput", "badInput")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示用户提供了浏览器不能转换的输入。</dd>
+ <dt>customError {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，表示这个元素的自定义验证信息是否已通过调用元素的 {{domxref('HTMLObjectElement.setCustomValidity', 'setCustomValidity()')}} 方法设置为一个非空字符串。</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("ValidityState.patternMismatch", "patternMismatch")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示元素值不匹配规定的{{htmlattrxref("pattern", "input")}}，<code>false</code> 则表示匹配。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.rangeOverflow", "rangeOverflow")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示值已超过 {{htmlattrxref("max", "input")}} 属性规定的最大值，<code>false</code> 则表示小于或等于这个最大值。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 和 {{cssxref(":out-of-range")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.rangeUnderflow", "rangeUnderflow")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示值小于 {{htmlattrxref("min", "input")}} 属性规定的最小值，<code>false</code> 则表示大于或等于这个最小值。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 和 {{cssxref(":out-of-range")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.stepMismatch", "stepMismatch")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示值不符合由 {{htmlattrxref("step", "input")}} 属性规定的规则（即该值不能被步长值除尽，译注：假设最小值是0）。<code>false</code> 表示其符合步长值规则。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 和 {{cssxref(":out-of-range")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.tooLong", "tooLong")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示值超过了{{domxref("HTMLInputElement")}} 或 {{domxref("HTMLTextAreaElement")}} 对象中规定的 <code>maxlength</code>， <code>false</code> 表示值的长度小于或等于最大长度。<em><strong>注意：</strong>This这个属性在Gecko中永远不会是 <code>true</code>，因为元素值不允许比 <code>maxlength</code> 长。</em><code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 和 {{cssxref(":out-of-range")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.tooShort", "tooShort")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示值的长度小于 {{domxref("HTMLInputElement")}} 或 {{domxref("HTMLTextAreaElement")}} 对象中规定的 <code>minlength</code>， <code>false</code> 表示值的长度大于或等于最大长度。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 和 {{cssxref(":out-of-range")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.typeMismatch", "typeMismatch")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示元素值不满足所需的格式（可见于 {{htmlattrxref("type", "input")}} 是 <code>email</code> 或 <code>url</code> 时），<code>false</code> 表示格式正确。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 匹配。</dd>
+ <dt>valid {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}，<code>true</code> 表示元素满足所有的验证约束，因此被认为时有效的，<code>false</code> 表示有任一约束不满足。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":valid")}} 匹配，否则可用 CSS 伪类 {{cssxref(":invalid")}} 匹配。</dd>
+ <dt>{{domxref("ValidityState.valueMissing", "valueMissing")}} {{ReadOnlyInline}}</dt>
+ <dd>一个 {{jsxref("Boolean")}}， <code>true</code> 表示元素拥有 {{htmlattrxref("required", "input")}} 属性，但没有值，否则为 <code>false</code>。<code>true</code> 的时候元素可用 CSS 伪类 {{cssxref(":invalid")}} 匹配。</dd>
+</dl>
+
+<h2 id="属性_2">属性</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">规范</th>
+   <th scope="col">状态</th>
+   <th scope="col">注释</th>
+  </tr>
+  <tr>
+   <td>{{ SpecName('HTML WHATWG', 'form-control-infrastructure.html#validitystate', 'ValidityState') }}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Living Standard</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('HTML5.1', 'sec-forms.html#validitystate-validitystate', 'ValidityState') }}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>No change from the previous snapshot {{SpecName('HTML5 W3C')}}.</td>
+  </tr>
+  <tr>
+   <td>
+    <p>{{ SpecName('HTML5 W3C', 'forms.html#validitystate', 'ValidityState') }}</p>
+   </td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>
+    <p>First snapshot of  {{SpecName('HTML WHATWG')}} containing this interface.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<p>{{Compat("api.ValidityState")}}</p>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5/Constraint_validation">约束验证</a></li>
+ <li><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Learn/HTML/Forms/Data_form_validation">表单数据校验</a></li>
+</ul>