Пример
HTML форма с полем ввода, которое может содержать только три буквы (без цифр и специальных символов):
<form action="/action_page.php">
<label for="country_code">Код страны:</label>
<input
type="text" id="country_code" name="country_code"
pattern="[A-Za-z]{3}"
title="Трехбуквенный код страны"><br><br>
<input type="submit">
</form>
Попробуйте сами »
Больше примеров "Попробуйте сами" ниже.
Определение и использование
Атрибут pattern задает регулярное выражение, которому должно соответствовать значение элемента
<input> при отправке формы.
Примечание: Атрибут pattern работает со следующими типами input:
text, date, search, url, tel, email и password.
Совет: Используйте глобальный атрибут title для описания шаблона, чтобы помочь пользователю.
Совет: Узнайте больше о регулярных выражениях в нашем JavaScript руководстве.
Поддержка браузерами
Цифры в таблице указывают первую версию браузера, которая полностью поддерживает атрибут.
| Атрибут | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | 10.1 | 9.6 |
Синтаксис
<input pattern="regexp">
Значения атрибута
| Значение | Описание |
|---|---|
| regexp | Задает регулярное выражение, которому проверяется значение элемента <input> |
Больше примеров
Пример
Элемент <input> с type="password", который должен содержать 8 или более символов:
<form action="/action_page.php">
<label for="pwd">Пароль:</label>
<input type="password" id="pwd"
name="pwd"
pattern=".{8,}" title="Восемь или более символов">
<input type="submit">
</form>
Попробуйте сами »
Пример
Элемент <input> с type="password", который должен содержать 8 или более символов, включая как минимум одну цифру, одну заглавную и одну строчную букву:
<form action="/action_page.php">
<label for="pwd">Пароль:</label>
<input type="password" id="pwd" name="pwd"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
title="Должен содержать как минимум одну цифру, одну заглавную и одну строчную букву, и быть не менее 8 символов">
<input type="submit">
</form>
Попробуйте сами »
Пример
Элемент <input> с type="email", который должен быть в следующем порядке: символы@символы.домен (символы, за которыми следует знак @, затем еще символы, а затем точка ".")
После знака "." должно быть не менее 2 букв от a до z:
<form action="/action_page.php">
<label
for="email">Email:</label>
<input type="email" id="email" name="email"
pattern="[a-z0-9._%+\-]+@[a-z0-9.\-]+\.[a-z]{2,}$">
<input type="submit">
</form>
Попробуйте сами »
Пример
Элемент <input> с type="search", который НЕ должен содержать следующие символы: ' или "
<form action="/action_page.php">
<label
for="search">Поиск:</label>
<input type="search" id="search" name="search"
pattern="[^'\x22]+" title="Недопустимый ввод">
<input type="submit">
</form>
Попробуйте сами »
Пример
Элемент <input> с type="url", который должен начинаться с http:// или https://, за которыми следует как минимум один символ:
<form action="/action_page.php">
<label
for="website">Домашняя страница:</label>
<input type="url" id="website"
name="website"
pattern="https?://.+" title="Включите http://">
<input type="submit">
</form>