Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Атрибут required

.

Атрибут required

Булев атрибут required сообщает браузеру, что форма не может быть отправлена, пока данное поле ввода не заполнено корректными данными.

Обычно это означает, что поле просто не может оставаться пустым, но в некоторых случаях, в зависимости от наличия других атрибутов, будет иметь значение и тин введенных в него данных. Ниже в этой главе мы расскажем, как сообщить браузеру тип данных, которые должны быть введены в форме.

Если обязательное поле осталось пустым или тип данных не соответствует требуемому, форма не будет отправлена, а фокус ввода переместится на первый неправильно заполненный элемент.

В браузерах Opera, Firefox и Chrome появится сообщение об ошибке, например «Пожалуйста, заполните это поле», «Вы не указали значение», если поле осталось пустым, или «Пожалуйста, укажите e-mail», «Неверный формат данных», если введены неверные данные.

Параметр required может быть установлен для любого поля формы, за исключением button, range, color и hidden, которые, как правило, имеют значение по умолчанию. Как и для рассмотренных выше булевых атрибутов, синтаксис данного атрибута может быть либо просто required, либо required="required" (вариант XHTML).

Давайте добавим атрибут required к нашей форме подписки. Сделаем обязательными поля name, email address, password и subscription start date:

Атрибут required

Атрибут required

Чтобы улучшить доступность, везде, где встречается атрибут required, мы добавили параметр ARIA: aria-required="true". Многие экранные дикторы не поддерживают новые элементы HTML5, зато имеют поддержку WAI-ARIA, и это шанс дать пользователю знать, что данное поле — обязательное. Рисунки 4.1-4.3 демонстрируют поведение атрибута required при попытке отправить форму.

Атрибут required

Рис. 4.1. Валидация поля с атрибутом required в Firefox 4

Атрибут required

Рис. 4.2. Так это выглядит в Opera…

Атрибут required

Рис. 4.3. …а так — в Google Chrome

.

Читайте так же:
Not found