HTML Атрибут pattern

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

Синтаксис

<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» вхождений предыдущего символа(-ов) в строку.

*

Произвольное число вхождений предыдущего символа(-ов) в строку.

+

Одно или более число вхождений предыдущего символа(-ов) в строку.

?

Ни одного или одно вхождение предыдущего символа(-ов) в строку.

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

Нет.

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

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

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

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

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

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 и более символов:

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

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

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

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

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

Учебник HTML

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