From 4f1ba6d2c029e2f1026766f755ffffe0a6ed972a Mon Sep 17 00:00:00 2001 From: Roma Zvarich Date: Sun, 18 Jul 2021 14:18:00 +0300 Subject: Перевод "Validitystate" и дочерних статей (#1531) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * '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> --- .../api/validitystate/patternmismatch/index.html | 58 ++++++++++++++++++++++ 1 file changed, 58 insertions(+) create mode 100644 files/ru/web/api/validitystate/patternmismatch/index.html (limited to 'files/ru/web/api/validitystate/patternmismatch') 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 +--- +

{{draft}}Доступное только для чтения свойство patternMismatch объекта ValidityState указывает, соответствует ли значение {{HTMLElement("input")}} шаблону, указанному в атрибуте pattern.

+ +

Если поле поддерживает атрибут pattern, это значит, что {{HTMLElement("input")}} содержит type {{HTMLElement("input/text", "text")}}, {{HTMLElement("input/tel", "tel")}}, {{HTMLElement("input/email", "email")}}, {{HTMLElement("input/url", "url")}}, {{HTMLElement("input/password", "password")}} или {{HTMLElement("input/search", "search")}} и в значении атрибута задано валидное регулярное выражение. Если значение не соответствует ограничениям, заданным в pattern, свойство patternMismatch будет true.

+ +

Примеры

+ +

Учитывая следующее:

+ +
<p>
+ <label>Enter your phone number in the format (123)456-7890
+  (<input name="tel1" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit area code" size="2"/>)-
+   <input name="tel2" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit prefix" size="2"/> -
+   <input name="tel3" type="tel" pattern="[0-9]{4}" placeholder="####" aria-label="4-digit number" size="3"/>
+ </label>
+</p>
+ +

Здесь у нас есть 3 поля для номера телефона северной Америки, помещённых внутрь label. В каждом поле, как определено в атрибуте pattern, ожидается ввод 3, 3 и 4 символов соответственно.

+ +

Если значения слишком длинные, слишком короткие или содержат не цифровые символы, patternMismatch будет true. Если true, элемент соответствует CSS-псевдоклассу{{cssxref(":invalid")}}.

+ +
input:invalid {
+  border: red solid 3px;
+}
+ +

{{EmbedLiveSample("Examples", 300, 40)}}

+ +

Обратите внимание, что в данном примере мы получаем значение свойства patternMismatch, а не {{domxref('validityState.tooLong')}} или {{domxref('validityState.tooShort')}}, потому что ограничения заданы именно с помощью атрибута pattern. Если бы вместо него использовались атрибуты minlength и maxlength, для валидации можно было использовать {{domxref('validityState.tooLong')}} или {{domxref('validityState.tooShort')}}.

+ +
+

Примечание: Если атрибут pattern не используется, поле {{HTMLElement("input/email", "email")}} требует, соответствия значения хотя бы формату x@y, а поле {{HTMLElement("input/url", "url")}} — хотя бы формату x:. Если поле не валидно, свойство {{domxref('validityState.typeMismatch')}} будет true, если не используется атрибут pattern.

+
+ +

Спецификации

+ +{{Specifications}} + +

Совместимость с браузерами

+ +

{{Compat}}

+ +

Также смотрите

+ + -- cgit v1.2.3-54-g00ecf