Перевод "Validitystate" и дочерних статей (#1531)

* 'ValidityState' topic

* 'badInput' topic

* 'patternMismatch' topic

* 'range overflow' article

* 'range underflow' article

* 'step mismatch' article

* 'Too long' article

* 'Too short' article

* 'Type mismatch' article

* 'Read only' fix

* Typo fix

* Update files/ru/web/api/validitystate/badinput/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/badinput/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/stepmismatch/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/toolong/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/typemismatch/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/typemismatch/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

* Update files/ru/web/api/validitystate/typemismatch/index.html

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

Co-authored-by: Maxim Postautov <54762420+mpstv@users.noreply.github.com>

9 files changed, 407 insertions, 0 deletions

diff --git a/files/ru/web/api/validitystate/badinput/index.html b/files/ru/web/api/validitystate/badinput/index.html
new file mode 100644
index 0000000000..107bbd32bb
--- /dev/null
+++ b/files/ru/web/api/validitystate/badinput/index.html
@@ -0,0 +1,42 @@
+---
+title: validityState.badInput
+slug: Web/API/ValidityState/badInput
+tags:
+  - API
+  - Constraints API
+  - HTML DOM
+  - Свойство
+  - Только для чтения
+  - ValidityState
+browser-compat: api.ValidityState.badInput
+---
+<p>{{APIRef("HTML DOM")}}</p>
+
+<p>Доступное только для чтения свойство <strong><code>badInput</code></strong> объекта <a href="/ru/docs/Web/API/ValidityState">ValidityState</a>, указывающее, что пользователь ввёл значение, которое браузер не может преобразовать. Например, поле ввода чисел, содержащее строку. <em><strong>Примечание:</strong> Во всех браузерах, кроме Internet Explorer, ввести в числовое поле любое нечисловое значения не удастся.</em></p>
+
+<h2 id="Example">Пример</h2>
+
+<pre class="brush: html">&lt;input type="number" id="age"&gt;</pre>
+
+<pre class="brush: js">var input = document.getElementById("age");
+if (input.validity.badInput) {
+  console.log("Bad input detected…");
+} else {
+  console.log("Content of input ok.");
+}
+</pre>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Руководство: Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Учебник: Валидация форм</a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/index.html b/files/ru/web/api/validitystate/index.html
new file mode 100644
index 0000000000..77755c915f
--- /dev/null
+++ b/files/ru/web/api/validitystate/index.html
@@ -0,0 +1,58 @@
+---
+title: ValidityState
+slug: Web/API/ValidityState
+tags:
+  - API
+  - Constraint Validation API
+  - Формы
+  - HTML DOM
+  - Интерфейс
+browser-compat: api.ValidityState
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p>Интерфейс <strong><code>ValidityState</code></strong> представляет <em>состояния валидности</em>, в которых может находиться элемент при валидации ограничений. Вместе они помогают понять, по какой именно причине значение элемента не прошло валидацию.</p>
+
+<h2 id="Properties">Свойства</h2>
+
+<p>Если свойство возвращает <code>true</code>, значит оно отражает причину, по которой значение не прошло валидацию. Исплючением является лишь свойство <code>valid</code>, которое возвращает <code>true</code>, когда значение элемента соответствует всем ограничениям.</p>
+
+<dl>
+ <dt>{{domxref("ValidityState.badInput", "badInput")}} {{ReadOnlyInline}}</dt>
+ <dd>{{jsxref("Boolean")}} <code>true</code>, если пользователь ввёл значение, которое браузер не может преобразовать.</dd>
+ <dt><code>customError</code> {{ReadOnlyInline}}</dt>
+ <dd>{{jsxref("Boolean")}}, указывающий, было ли установлено кастомное сообщение валидации путём вызова метода {{domxref('HTMLObjectElement.setCustomValidity', 'setCustomValidity()')}} с непустой строкой в аргументе.</dd>
+ <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")}} (то есть, не делится без остатка на значение шага). <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>, если значение превышает лимит, указанный в атрибуте <code>maxlength</code> объектов {{domxref("HTMLInputElement")}} или {{domxref("HTMLTextAreaElement")}}. <code>false</code>, если длина меньше или равна максимальной длине. <em><strong>Примечание:</strong> Данное свойство никогда не будет <code>true</code> в Gecko, потому что значению элемента не разрешается быть больше <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>, если длина значения не достигает минимума, указанного в атрибуте <code>minlength</code> объектов {{domxref("HTMLInputElement")}} и {{domxref("HTMLTextAreaElement")}}. <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><code>valid</code> {{ReadOnlyInline}}</dt>
+ <dd>{{jsxref("Boolean")}} <code>true</code>, если элемент соответствует всем ограничениям валидации и, следовательно, считается валидным. <code>false</code>, если не соответствует любому ограничению. Если <code>true</code>, элемент соответствует CSS-псевдоклассу {{cssxref(":valid")}}; иначе — псевдоклассу {{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="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузером</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Также смотрите</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Руководство: Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Учебник: Валидация форм</a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/patternmismatch/index.html b/files/ru/web/api/validitystate/patternmismatch/index.html
new file mode 100644
index 0000000000..ebe0e1aac1
--- /dev/null
+++ b/files/ru/web/api/validitystate/patternmismatch/index.html
@@ -0,0 +1,58 @@
+---
+title: ValidityState.patternMismatch
+slug: Web/API/ValidityState/patternMismatch
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Property
+  - Reference
+browser-compat: api.ValidityState.patternMismatch
+---
+<p>{{draft}}Доступное только для чтения свойство <strong><code>patternMismatch</code></strong> объекта  <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, соответствует ли значение {{HTMLElement("input")}} шаблону, указанному в атрибуте <code><a href="/ru/docs/Web/HTML/Attributes/pattern">pattern</a></code>.</p>
+
+<p>Если поле поддерживает атрибут <code><a href="/ru/docs/Web/HTML/Attributes/pattern">pattern</a></code>, это значит, что {{HTMLElement("input")}} содержит <code>type</code> {{HTMLElement("input/text", "text")}}, {{HTMLElement("input/tel", "tel")}}, {{HTMLElement("input/email", "email")}}, {{HTMLElement("input/url", "url")}}, {{HTMLElement("input/password", "password")}} или {{HTMLElement("input/search", "search")}} и в значении атрибута задано валидное регулярное выражение. Если значение не соответствует ограничениям, заданным в <code><a href="/ru/docs/Web/HTML/Attributes/pattern">pattern</a></code>, свойство <code>patternMismatch</code> будет <code>true</code>.</p>
+
+<h2 id="Examples">Примеры</h2>
+
+<p>Учитывая следующее:</p>
+
+<pre class="brush: html">&lt;p&gt;
+ &lt;label&gt;Enter your phone number in the format (123)456-7890
+  (&lt;input name="tel1" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit area code" size="2"/&gt;)-
+   &lt;input name="tel2" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit prefix" size="2"/&gt; -
+   &lt;input name="tel3" type="tel" pattern="[0-9]{4}" placeholder="####" aria-label="4-digit number" size="3"/&gt;
+ &lt;/label&gt;
+&lt;/p&gt;</pre>
+
+<p>Здесь у нас есть 3 поля для номера телефона северной Америки, помещённых внутрь <code>label</code>. В каждом поле, как определено в атрибуте <code><a href="/ru/docs/Web/HTML/Attributes/pattern">pattern</a></code>, ожидается ввод 3, 3 и 4 символов соответственно.</p>
+
+<p>Если значения слишком длинные, слишком короткие или содержат не цифровые символы, <code>patternMismatch</code> будет <code>true</code>. Если <code>true</code>, элемент соответствует CSS-псевдоклассу{{cssxref(":invalid")}}.</p>
+
+<pre class="brush: css">input:invalid {
+  border: red solid 3px;
+}</pre>
+
+<p>{{EmbedLiveSample("Examples", 300, 40)}}</p>
+
+<p>Обратите внимание, что в данном примере мы получаем значение свойства <code>patternMismatch</code>, а не {{domxref('validityState.tooLong')}} или {{domxref('validityState.tooShort')}}, потому что ограничения заданы именно с помощью атрибута <code>pattern</code>. Если бы вместо него использовались атрибуты <code><a href="/en-US/docs/Web/HTML/Attributes/minlength">minlength</a></code> и <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>, для валидации можно было использовать {{domxref('validityState.tooLong')}} или {{domxref('validityState.tooShort')}}.</p>
+
+<div class="notecard note">
+<p>Примечание: Если атрибут <code>pattern</code> не используется, поле <code>{{HTMLElement("input/email", "email")}}</code> требует, соответствия значения хотя бы формату <code>x@y</code>, а поле <code>{{HTMLElement("input/url", "url")}}</code> — хотя бы формату <code>x:</code>. Если поле не валидно, свойство {{domxref('validityState.typeMismatch')}} будет <code>true</code>, если не используется атрибут <code>pattern</code>.</p>
+</div>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Также смотрите</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Формы: Валидация форм</a></li>
+ <li><a href="/ru/docs/Web/JavaScript/Guide/Regular_Expressions">Регулярные выражения</a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/rangeoverflow/index.html b/files/ru/web/api/validitystate/rangeoverflow/index.html
new file mode 100644
index 0000000000..bc06117b38
--- /dev/null
+++ b/files/ru/web/api/validitystate/rangeoverflow/index.html
@@ -0,0 +1,38 @@
+---
+title: ValidityState.rangeOverflow
+slug: Web/API/ValidityState/rangeOverflow
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Свойство
+  - Справочник
+browser-compat: api.ValidityState.rangeOverflow
+---
+<p>Доступное только для чтения свойство <strong><code>rangeOverflow</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, что после редактирования пользователем поля {{HTMLElement("input")}}, значение не соответствует ограничениям, установленным атрибутом <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code>.</p>
+
+<p>Если поле является числовым, включая типы {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}}, {{HTMLElement("input/range", "range")}} и заданно значение атрибута max, если содержимое поля не соответствует ограничению атрибута <code><a href="/en-US/docs/Web/HTML/Attributes/step">max</a></code>, свойство <code>rangeOverflow</code> будет true.</p>
+
+<p>Учитывая слещующее:</p>
+
+<pre class="brush: html">&lt;input type="number" min="20" max="40" step="2"/&gt;</pre>
+
+<p>если <code>value &gt; 40</code>, <code>rangeOverflow</code> будет true. Если <code>true</code>, элемент соответствует CSS-псевдоклассам {{cssxref(":invalid")}} и {{cssxref(":out-of-range")}}.</p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("ValidityState.rangeUnderflow")}}</li>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+ <li><a href="/en-US/docs/Web/HTML/Attributes/step">Атрибут <code>step</code></a></li>
+ <li><a href="/en-US/docs/Web/HTML/Attributes/min">Атрибут <code>min</code></a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/rangeunderflow/index.html b/files/ru/web/api/validitystate/rangeunderflow/index.html
new file mode 100644
index 0000000000..38fa11c8c8
--- /dev/null
+++ b/files/ru/web/api/validitystate/rangeunderflow/index.html
@@ -0,0 +1,38 @@
+---
+title: ValidityState.rangeUnderflow
+slug: Web/API/ValidityState/rangeUnderflow
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Свойство
+  - Справочник
+browser-compat: api.ValidityState.rangeUnderflow
+---
+<p>Доступное только для чтения свойство <strong><code>rangeUnderflow</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, соответствует ли значение {{HTMLElement("input")}} после изменения пользователем ограничениям, установленным атрибутом <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code>.</p>
+
+<p>Если поле является числовым, включая типы {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}}, {{HTMLElement("input/range", "range")}} и заданно значение атрибута <code>min</code>, если содержимое поля не соответствует ограничению атрибута <code><a href="/en-US/docs/Web/HTML/Attributes/step">min</a></code>, свойство <code>rangeUnderflow</code> будет true.</p>
+
+<p>Учитывая следующее:</p>
+
+<pre class="brush: html">&lt;input type="number" min="20" max="40" step="2"/&gt;</pre>
+
+<p>если <code>value &lt; 20</code>, <code>rangeUnderflow</code> будет true. Если <code>true</code>, элемент соответствует CSS-псевдоклассам {{cssxref(":invalid")}} и {{cssxref(":out-of-range")}}.</p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("ValidityState.rangeOverflow")}}</li>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+ <li><a href="/en-US/docs/Web/HTML/Attributes/step">Атрибут <code>step</code></a></li>
+ <li><a href="/en-US/docs/Web/HTML/Attributes/max">Атрибут <code>max</code></a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/stepmismatch/index.html b/files/ru/web/api/validitystate/stepmismatch/index.html
new file mode 100644
index 0000000000..3a29e316b5
--- /dev/null
+++ b/files/ru/web/api/validitystate/stepmismatch/index.html
@@ -0,0 +1,38 @@
+---
+title: ValidityState.stepMismatch
+slug: Web/API/ValidityState/stepMismatch
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Свойство
+  - Справочник
+browser-compat: api.ValidityState.stepMismatch
+---
+<p>Доступное только для чтения свойство <strong><code>stepMismatch</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, соответствует ли значение {{HTMLElement("input")}} после изменения пользователем ограничениям, установленным атрибутом <code>step</code>.</p>
+
+<p>Если поле является числовым, включая типы {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}}, {{HTMLElement("input/range", "range")}} и значение атрибута <code>step</code> не равно <code>any</code>, в случае не соответствия поля ограниченям атрибутов <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code> и <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code>, то <code>stepMismatch</code> будет true. Если остаток от деления значения элемента формы за вычетом <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> на <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code>, (которое по умолчаиню равно 1) не равен нулю, то это является несоответствием.</p>
+
+<p>Учитывая следующее:</p>
+
+<pre class="brush: html">&lt;input type="number" min="20" max="40" step="2"/&gt;</pre>
+
+<p>если <code>(value - min) % 2 != 0</code>, <code>stepMismatch</code> будет true.</p>
+
+<p>Если true, элемент соответствует CSS-псевдоклассам {{cssxref(":invalid")}} и {{cssxref(":out-of-range")}}.</p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+ <li><a href="/en-US/docs/Web/HTML/Attributes/step">Атрибут <code>step</code></a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/toolong/index.html b/files/ru/web/api/validitystate/toolong/index.html
new file mode 100644
index 0000000000..d824c67dcb
--- /dev/null
+++ b/files/ru/web/api/validitystate/toolong/index.html
@@ -0,0 +1,30 @@
+---
+title: validityState.tooLong
+slug: Web/API/ValidityState/tooLong
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Нужны примеры
+  - Свойство
+  - Справочник
+browser-compat: api.ValidityState.tooLong
+---
+<div>{{draft}}</div>
+
+<p><span class="seoSummary">Доступное только для чтения свойство <strong><code>tooLong</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, превышает ли длина значения {{HTMLElement("input")}} или {{HTMLElement("textarea")}}, после редактирования пользователем, заданный в атрибуте <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code> максимум.</span></p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/tooshort/index.html b/files/ru/web/api/validitystate/tooshort/index.html
new file mode 100644
index 0000000000..22af754fb4
--- /dev/null
+++ b/files/ru/web/api/validitystate/tooshort/index.html
@@ -0,0 +1,21 @@
+---
+title: validityState.tooShort
+slug: Web/API/ValidityState/tooShort
+browser-compat: api.ValidityState.tooShort
+---
+<p>Доступное только для чтения свойство <strong><code>tooShort</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, является ли длина изменённого пользователем значения {{HTMLElement("input")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}, {{HTMLElement("output")}}, {{HTMLElement("fieldset")}} или {{HTMLElement("textarea")}} меньше минимально допустимого значения, заданного в атрибуте <code>minlength</code>.</p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+</ul>
diff --git a/files/ru/web/api/validitystate/typemismatch/index.html b/files/ru/web/api/validitystate/typemismatch/index.html
new file mode 100644
index 0000000000..d641ea673b
--- /dev/null
+++ b/files/ru/web/api/validitystate/typemismatch/index.html
@@ -0,0 +1,84 @@
+---
+title: ValidityState.typeMismatch
+slug: Web/API/ValidityState/typeMismatch
+tags:
+  - API
+  - Constraint Validation API
+  - DOM
+  - Свойство
+  - Справочник
+browser-compat: api.ValidityState.typeMismatch
+---
+<p>{{draft}}Доступное только для чтения свойство <strong><code>typeMismatch</code></strong> объекта <strong><code><a href="/ru/docs/Web/API/ValidityState">ValidityState</a></code></strong> указывает, соответствует ли изменённое пользователем значение {{HTMLElement("input")}} ограничениям атрибута <code><a href="/ru/docs/Web/HTML/Element/input#input_types">type</a></code>.</p>
+
+<p>Если атрибут <code>type</code> получает типы вроде {{HTMLElement("input/email", "email")}} или {{HTMLElement("input/url", "url")}}, а значение не соответствует ограничениям данного типа, свойство <code>typeMismatch</code> будет true.</p>
+
+<p>Тип {{HTMLElement("input/email", "email")}} допускает ввод одного или нескольких email-адресов, в зависимости от наличия атрибута <code><a href="/en-US/docs/Web/HTML/Attributes/multiple">multiple</a></code>. Валидный email-адрес включает префикс электронной почты и домен, с доменом верхнего уровня или без него. Если значение поля email-адреса не является пустой строкой, одним или несколькими email-адресами, разделёнными запятой (если присутствует атрибут <code><a href="/en-US/docs/Web/HTML/Attributes/multiple">multiple</a></code>), то это <code>typeMismatch</code>.</p>
+
+<p>Тип {{HTMLElement("input/url", "url")}} допускает ввода одного или нескольких url-адресов, в зависимости от наличия атрибута <code><a href="/en-US/docs/Web/HTML/Attributes/multiple">multiple</a></code>. Валидный URL-адрес включает протокол с IP-адресом или комбинацией поддоменом, домена и домен верхнего уровня. Если значение поля URL не ялвяется пустой строкой, одним или несколькими URL-адресами, разделёнными запятой (если присутствует атрибут <code><a href="/en-US/docs/Web/HTML/Attributes/multiple">multiple</a></code>), то это <code>typeMismatch</code>.</p>
+
+<table class="standard-table">
+ <caption>Соответствие атрибуту <code>type</code></caption>
+ <thead>
+  <tr>
+   <th>Тип input</th>
+   <th>Значение</th>
+   <th>Ожидаемое значение</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("input/email", "email")}}</td>
+   <td><code>x@y</code> или <code>x@y.z</code></td>
+   <td>Email-адрес с или без <a href="/en-US/docs/Glossary/TLD">TLD</a></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/url", "url")}}</td>
+   <td><code>x:</code> или <code>x://y.z</code></td>
+   <td>Протокол или полный URL с протоколом</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Examples">Примеры</h2>
+
+<p>Учитывая следующее:</p>
+
+<pre class="brush: html">&lt;p&gt;
+ &lt;label&gt;
+    Enter an email address:
+    &lt;input type="email" value="example.com"/&gt;
+ &lt;/label&gt;
+&lt;/p&gt;
+&lt;p&gt;
+ &lt;label&gt;
+     Enter a URL:
+     &lt;input type="url" value="example.com"/&gt;
+  &lt;/label&gt;
+&lt;/p&gt;</pre>
+
+<pre class="brush: css">input:invalid {
+  border: red solid 3px;
+}</pre>
+
+<p>{{EmbedLiveSample("Examples", 300, 40)}}</p>
+
+<p>В примере выше в обоих полях происходит <code>typeMismatch</code>, потому что email-адрес является просто доменом, а URL не содержит протокол</p>
+
+<p><code>typeMismatch</code> происходит при несоответствии <code><a href="/en-US/docs/Web/HTML/Attributes/value">значения</a></code>, заданного в атрибуте <code><a href="/ru/docs/Web/HTML/Element/input#%3cinput%3e_types">type</a></code> и содержимым поля. <code>typeMismatch</code> является лишь одной из возможных ошибок и возможна только для полей {{HTMLElement("input/email", "email")}} и {{HTMLElement("input/url", "url")}}. Когда введённое значение не соответствует ожидаемому для других полей ввода, в зависимости от типа поля будут возникать разные ошибки. Например, если в поле {{HTMLElement("input/number", "number")}} ввести значение не являющееся числом с плавающей запятой, <code>badInput</code> будет <code>true</code>. Если <code><a href="/en-US/docs/Web/HTML/Attributes/required">обязательное</a> поле email не заполнено</code>, {{domxref('ValidityState.valueMissing','valueMissing')}} будет <code>true</code>.</p>
+
+<h2 id="Specifications">Спецификации</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">Смотрите также</h2>
+
+<ul>
+ <li><a href="/ru/docs/Web/Guide/HTML/HTML5/Constraint_validation">Валидация ограничений</a></li>
+ <li><a href="/ru/docs/Learn/Forms/Form_validation">Валидация форм на стороне клиента</a></li>
+ <li><a href="/ru/docs/Web/JavaScript/Guide/Regular_Expressions">Регулярные выражения</a></li>
+</ul>