Атрибут pattern
Синтаксис
HTML
<input type="..." pattern="[значение]">
Описание
Атрибут / параметр pattern
(от англ. "pattern" ‒ «шаблон») задаёт шаблон (регулярное выражение) для значения текстового элемента формы.
Примечание
- Шаблон ввода распространяется на всё значение элемента формы.
- Рекомендуется указывать описание шаблона в глобальном атрибуте «
title
» и/или в тексте рядом с соответствующим элементом формы.
Условия использования
- Применяется только к следующим типам полей формы: «
email
», «password
», «search
», «tel
», «text
», «url
». - Специальные символы указываемые в значении поля формы должны быть экранированы. Например, символ «
&
» АМПЕРСАНД [U+0022] должен быть заменён символьной ссылкой «&
».
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.
Спецификация
Верс. | Раздел |
---|---|
HTML | |
2.0 | |
3.2 | |
4.01 | |
5.0 | 4.10.5.3.6 The pattern attribute The pattern attribute... |
5.1 | 4.10.5.3.6. The pattern attribute The pattern attribute... |
XHTML | |
1.0 | |
1.1 |
Значения
В качестве значения данного атрибута указывается любое регулярное выражение. Регулярное выражение может включать в себя следующие обозначения:
Инверсия
Числа
- [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] (например, «(
» ⇒ «\(
», «{
» ⇒ «\{
», «+
» ⇒ «\+
»).
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Параметр pattern (Элемент input)</title>
</head>
<body>
<h1>Пример использования атрибутом "pattern"</h1>
<form action="/examples/php-scripts/telephone.php" method="post">
<p><label>Мобильный телефон:
<input type="tel" name="phone_number" placeholder="+7 (900) 123-45-67" pattern="\+7\s?[\(]{0,1}9[0-9]{2}[\)]{0,1}\s?\d{3}[-]{0,1}\d{2}[-]{0,1}\d{2}"></label></p>
<p><input type="reset"> <input type="submit"></p>
</form>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Параметр pattern (Элемент input)</title>
</head>
<body>
<h1>Пример использования атрибутом "pattern"</h1>
<form action="/examples/php-scripts/telephone.php" method="post">
<p><label>Мобильный телефон:
<input type="tel" name="phone_number" placeholder="+7 (900) 123-45-67" pattern="\+7\s?[\(]{0,1}9[0-9]{2}[\)]{0,1}\s?\d{3}[-]{0,1}\d{2}[-]{0,1}\d{2}"></label></p>
<p><input type="reset"> <input type="submit"></p>
</form>
</body>
</html>
Параметр pattern (Элемент input)