Атрибут HTML: required

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

Атрибут required поддерживается типами text, search, url, tel, email, password, date, month, week, time, datetime-local, number, checkbox, radio, file, <input> наряду с элементами управления формы <select> и <textarea>. Если он присутствует в любом из этих типов ввода и элементов, псевдокласс :required будет соответствовать. Если атрибут не указан, будет соответствовать псевдокласс :optional.

Атрибут не поддерживается и не применим к типам ввода range и color, так как оба имеют значения по умолчанию. Тип color имеет значение по умолчанию #000000. Тип range по умолчанию равен середине между min и max — при этом min и max по умолчанию равны 0 и 100 соответственно в большинстве браузеров, если не объявлены. required также не поддерживается для типа ввода hidden — пользователи не должны заполнять скрытые поля ввода. Наконец, required не поддерживается для типов ввода кнопок, включая image.

В случае группы одноимённых радиокнопок (radio), если у одной радиокнопки в группе есть атрибут required, то радиокнопка в этой группе должна быть отмечена, хотя это не обязательно должна быть та, к которой применён атрибут. Для повышения качества обслуживания кода рекомендуется либо включить атрибут required в каждую радиокнопку с одинаковым именем в группе, либо ни в одну.

В случае группы одноимённых элементов ввода типа checkbox, требуются только те чекбоксы, у которых есть атрибут required.

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

При включении атрибута required предоставьте визуальное обозначение рядом с элементом управления, информирующее пользователя о том, что <input>, <select> или <textarea> является обязательным. Кроме того, используйте псевдокласс :required для обязательных элементов управления формы, стилизуя их таким образом, чтобы указать на их обязательность. Это улучшает удобство использования для пользователей с хорошим зрением. Средства вспомогательной технологии должны информировать пользователя о том, что элемент управления формой является обязательным, основываясь на атрибуте required, но добавление aria-required="true" не навредит, на случай, если комбинация браузера/диктора экрана пока не поддерживает required.

Если элемент обязателен, а значение элемента пустая строка, то у элемента есть ошибка valueMissing, и элемент будет соответствовать псевдоклассу :invalid.

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

• validityState.valueMissing
• :required и :optional
• <input>
• <select>