Required html что это
Перейти к содержимому

Required html что это

  • автор:

Атрибут required

Атрибут required указывает на то, что данный элемент HTML формы должен быть обязательно заполнен.

Атрибут следует применять к тегам input или textarea .

При попытке отправки формы в том случае, если поле с этим атрибутом не заполнено — браузер не даст отправить форму и выведет ошибку в виде всплывающей подсказки. К сожалению, текст ошибки и ее вид нельзя изменить с помощью HTML или CSS.

Имейте ввиду, что наличие атрибута required не освобождает вас от проверки правильности заполненности формы со стороны сервера на PHP (так как защиту через required легко обойти).

Пример

Давайте тегу input добавим атрибут required . Не вводя ничего в поле попробуйте нажать на кнопку, чтобы отправить форму. Браузер не даст отправить форму, добавит тень инпуту и выведет сообщение об ошибке:

Смотрите также

  • атрибут pattern ,
    который позволяет выполнить валидацию инпута

Атрибут required

Устанавливает поле формы обязательным для заполнения перед отправкой формы на сервер. Если обязательное поле пустое, браузер выведет сообщение, а форма отправлена не будет. Вид и содержание сообщения зависит от браузера и меняться пользователем не может. На рис. 1 показано сообщение в разных браузерах.

Chrome 11 Opera 11 Firefox 4
Chrome Opera Firefox

Рис. 1. Вид сообщения об обязательном поле

Синтаксис

Значения

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

По умолчанию атрибут required выключен.

HTML5 IE Cr Op Sa Fx

    Тег input, атрибут required  

Браузеры

Opera не проверяет введенное значение, если у не указан атрибут name .

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Атрибут required

Устанавливает поле формы обязательным для заполнения перед отправкой формы на сервер. Если обязательное поле пустое, браузер выведет сообщение об ошибке, а форма отправлена не будет. Вид и содержание сообщения зависит от браузера и меняться пользователем не может. На рис. 1 показано сообщение в разных браузерах.

Chrome Opera
Chrome Opera
Firefox Internet Explorer
Firefox Internet Explorer

Рис. 1. Вид сообщения об обязательном поле

Атрибут required может добавляться только к полю формы, у которого type имеет одно из значений: text , password , search , url , tel , email , date , month , week , time , datetime-local , number , checkbox , radio , file .

Синтаксис

Значения

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

По умолчанию атрибут required выключен.

Пример

input, атрибут required

Браузеры

10 12 4 12.1 5 4
2.3 4 12.1 4

Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

HTML-атрибут Required и радиопереключатели

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

Пример

Браузеры

Google Chrome Показывает уведомление для первого переключателя 1 : Взаимоисключающие HTML-переключатели в Google Chrome
Internet Explorer Показывает уведомление для переключателя, к которому применяется атрибут: Взаимоисключающие HTML-переключатели в Internet Explorer
Mozilla Firefox Показывает уведомление для первого переключателя 1 , но подсвечивает все: Взаимоисключающие HTML-переключатели в Mozilla Firefox
Opera Next Показывает уведомление для первого переключателя 1 : Взаимоисключающие HTML-переключатели в Opera Next
Opera Presto Показывает уведомление для переключателя, к которому применяется атрибут: Взаимоисключающие HTML-переключатели в Opera Presto
Safari Не поддерживает данный атрибут.
  1. — это переключатель, который в коде находится выше остальных.

При активации одного из переключателей форма отправляется.

  • The required attribute
  • Взаимоисключающиеся радиопереключатели HTML

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *