Справочники

HTML Элементы HTML Атрибуты Глобальные Атрибуты HTML События HTML MIME-типы HTML Коды языков HTMLТаблица цветов HTML ASCII HTML ISO-8859-1 HTML Windows-1251 HTML UTF-8 кирилица HTML URL для UTF-8 HTML URL для ISO-8859


 


HTML Атрибут pattern

Атрибут pattern (от англ. "pattern" — «шаблон») задаёт шаблон (регулярное выражение) для значения текстового элемента формы. Если присутствует атрибут pattern, то форма не будет отправляться, пока поле не будет заполнено правильно.

Совет: Рекомендуется указывать описание шаблона в глобальном атрибуте title и/или в тексте рядом с соответствующим элементом формы.

Синтаксис

<input type="..." pattern="[значение]">

Значения

В качестве значения данного атрибута указывается любое регулярное выражение. Регулярное выражение может включать в себя следующие обозначения:

Инверсия

^
Инверсия значения. Обозначает, что в значении должны отсутствовать символы указанные после символа «^» ЦИРКУМФЛЕКС [U+005E].
pattern="[^А-ЯЁ]"
(в значении должны отсутствовать любые прописные русские буквы).

Числа

[09]
Соответствует одному из указанных символов, то есть в данном случае «0» или «9».
[0-9]
Соответствует любому одному символу из указанного диапазона, то есть в данном случае от «0» до «9».

Буквы

[abc]
[абв]
Соответствует одному из указанных символов.

Примечание: при указании символов учитывается их регистр:

  • [abc] ‒ соответствует английской букве «a», «b» или «c».
  • [ABC] ‒ соответствует английской букве «A», «B» или «C».
  • [aBc] ‒ соответствует английской букве «a», «B» или «c».
  • [абв] ‒ соответствует русской букве «а», «б» или «в».
  • [АБВ] ‒ соответствует русской букве «А», «Б» или «В».
  • [аБв] ‒ соответствует русской букве «а», «Б» или «в».
[a-c]
[а-в]
Соответствует любой одной букве из указанного диапазона. При этом буквы указываемого диапазона должны быть одного регистра.

Примечание: для указания всех букв алфавита используются следующие шаблоны:

  • [a-z] ‒ соответствует любой строчной английской букве.
  • [A-Z] ‒ соответствует любой прописной английской букве.
  • [a-zA-Z] ‒ соответствует любой английской букве в любом регистре.
  • [а-яё] ‒ соответствует любой строчной русской букве.
  • [А-ЯЁ] ‒ соответствует любой прописной русской букве.
  • [а-яёА-ЯЁ] ‒ соответствует любой русской букве в любом регистре.

Специальные символы

\d
Соответствует любой цифре. (Аналогично значению «[0-9]»)
\w
Соответствует любой латинской букве, цифре и знаку препинания.
\s
Соответствует любому пробельному символу.
\D
Соответствует любым символам кроме цифр. (Аналогично значению «[^0-9]»)
\W
Соответствует любым символам кроме латинских букв, цифр и знаков препинания.
\S
Соответствует любым символам кроме пробельных символов.

Квантификаторы (количество вхождений символа в строку)

{n}
«n» вхождений предыдущего символа(-ов) в строку.
{n,}
«n» или более вхождений предыдущего символа(-ов) в строку.
{n,m}
От (не менее) «n» до (не более) «m» вхождений предыдущего символа(-ов) в строку.
*
Произвольное число вхождений предыдущего символа(-ов) в строку.
+
Одно или более число вхождений предыдущего символа(-ов) в строку.
?
Ни одного или одно вхождение предыдущего символа(-ов) в строку.

Примечание: Если в шаблоне необходимо указать какой-либо специальный символ (например, (, {, +), то его следует экранировать с помощью символа \ ОБРАТНЫЙ СЛЕШ [U+005C] (например, (\(, {\{, +\+).

Значение по умолчанию

Нет.

Применяется к тегам

<input>

Примечание: Атрибут pattern может быть использован с полями данных (тег input) следующих типов (атрибут type): text, search, url, tel, email, и password.

Отличия HTML 4.01 от HTML 5

Атрибут является новым в HTML 5.

Примеры использования:

Атрибут pattern (Элемент <input type="text">)

HTML форма с полем ввода, которое может содержать только три буквы:

Пример HTML:

Попробуй сам
<form action="action_form.php">
  Введите код: <input type="text" name="code" pattern="[A-Za-z]{3}" title="Три буквы кода">
  <input type="submit">
</form>

Атрибут pattern (Элемент <input type="password">)

HTML форма с полем ввода, которое должно содержать 6 и более символов:

Пример HTML:

Попробуй сам
<form action="action_form.php">
Пароль: <input type="password" name="password" pattern=".{6,}" title="6 и более символов">
<input type="submit">
</form>

Атрибут pattern (Элемент <input type="password">)

HTML форма с полем ввода, которое должно содержать 8 или более символов, в том числе по меньшей мере, одну цифру, одну прописную, одну строчные буквы:

Пример HTML:

Попробуй сам
<form action="action_form.php">
Пароль: <input type="password" name="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="8 или более символов, в том числе по меньшей мере, одну цифру,  одну прописную, одну строчные буквы">
<input type="submit">
</form>

Поддержка браузерами

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

Спецификация Статус
HTML 5 (W3C) Рекомендация
HTML 5.1 (W3C) Рекомендация

Учебник HTML

HTML уроки: HTML Атрибуты