Атрибут disabled в HTML


Содержание

Форум

Справочник

Поиск по форуму
Расширенный поиск
К странице.

Возникла небольшая проблема с формой обратной связи
с помощью нижеприведенного скрипта скрываются\показываются необходимые поля

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

Как сделать чтобы инпут опять становился активным?

Сообщение от alexmixaylov $(‘#infoaddress’).removeAttr(«disabled»);

Странно, что не работает.

Сообщение от alexmixaylov

Бивас, тест! (с)

ksa, судя по «live» код старый, и версия jQuery тоже. А между тем, «баг» пофиксили в версии 1.7.2 : http://bugs.jquery.com/ticket/10870

Причем по сути это не баг, а «неожиданность» для тех, кто плохо знает DOM (хотя нужно учесть что .prop() в jQuery появился не сразу)

live заменил на on

такая конструкция хорошо работает
если использовать removeAttr, то работает только один раз

Спасибо большое за помощь

Еще ввело в заблуждение — в файрбаге не показывает, что навешивается атрибут

Сообщение от alexmixaylov Еще ввело в заблуждение — в файрбаге не показывает, что навешивается атрибут

Потому что он здесь нигде не навешивается. Тут Вы меняете свойство, а не значение атрибута.

alexmixaylov, разве не видишь что код дублируется. Это не есть хорошо.

disabled() WP 3.0

Сравнивает два переданных значения, и если они совпадают, выводит текст disabled=’disabled’ — атрибут для input поля HTML-формы.

Функцию принято использовать внутри input и textarea полей HTML-формы.

Это одна из 4 функций помощников для форм: checked(), disabled(), selected(), readonly().


Атрибут disabled — Блокирует доступ и изменение поля формы. Оно в таком случае отображается серым и недоступным для активации пользователем. Кроме того, такое поле не может получить фокус путем нажатия на клавишу Tab, мышью или другим способом. Тем не менее, такое состояние поля можно менять с помощью скриптов. Заблокированное в поле значение не передается на сервер.

Возвращает

Выводит на экран строку disabled=’disabled’ при совпадении двух первых параметров или ничего не выводит. Если указать третий параметр $echo в 0 (false), то результат будет возвращен для обработки.

Использование

Примеры

#1 Демонстрация использования disabled

Допустим у нас есть группа radio полей формы. Одно из полей уже задействовано в опциях и логично, чтобы это поле не возможно было выбрать. В этом случае этому полю нужно добавить атрибут disabled. Этот пример показывает как сделать это удобно с помощью disabled().

Предположим, что в текущий момент значение поля option равно «red»:

:disabled

На этой странице

Описание

CSS псевдо-класс :disabled находит любой отключенный элемент. Элемент отключен, если не может быть активирован (например, его нельзя выбрать, нажать на него или ввести текст) или получить фокус. У элемента также есть включенное состояние, когда его можно активировать или сфокусировать.

Примеры

Пример селекторов

Пример использования

Применим к этому HTML5 фрагменту:

Добавим немного javascript:

Результатом будет отключение всех полей в группе адреса оплаты и окраска их в серый цвет.

HTML5 атрибуты форм (часть 2)

Дата публикации: 2020-03-09

От автора: данная статья является выдержкой из книги HTML5 и CSS3 для реального мира, 2-е издание за авторством Алексиса Гольдштейна, Луи Лазариса и Эстель Вейль. Книгу можно найти в магазинах по всему миру, а также купить цифровую версию.

Атрибут pattern

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

Язык регулярных выражений в шаблонах по синтаксису тот же, что и в JS на основе Perl за исключением того, что атрибут pattern должен удовлетворять всему значению, а не какому-то внутреннему набору. При использовании шаблонов пользователю необходимо сообщать разрешенные символы.


Глобальный атрибут title имеет особое значение в паре с pattern. В настоящий момент браузеры отображают значение атрибута title при наведении курсора в виде тултипа. Инструкции же в шаблоне более детальны, чем плейсхолдеры, и формируют более связное разъяснение. Атрибут title будет отображаться с сообщением об ошибке по умолчанию в браузерах с поддержкой нативной валидации. Об это мы поговорим в следующей главе.

Заметка: регулярные выражения

Регулярные выражения – функция большинства языков программирования, с помощью которой разработчики могут задавать шаблоны символов и проверять, подходит ли заданная строка под этот шаблон. Для новичков регулярные выражения просто темный лес. Например, выражение для проверки строки на значение цвета в формате hex выглядит следующим образом: #[A-Fa-f0-9]<6>.

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

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

В качестве базового примера давайте добавим атрибут pattern на поле с паролем в нашей форме. Нужно, чтобы пароль был минимум 6 символов без пробелов:

Запись \S означает «любой символ кроме пробела», а <6,>значит «минимум 6 раз». Хотите обозначить максимальное количество символов, можно использовать интервал, например, \S<6,10>.

Как и required, атрибут pattern запрещает отправку формы, если есть несоответствия с шаблоном. Также выскочит сообщение с ошибкой.

Если вы задали неправильное регулярное выражение, оно будет проигнорировано в целях валидации.

Атрибут pattern поддерживается в некоторой степени во всех браузерах, начиная с Firefox 4, Safari 5, Chrome 10, Opera 11, IE10 и Android 2.3. Под «в некоторой степени» понимается, что сейчас все браузеры поддерживают pattern. Однако Safari и Android до версии 4.4 позволяют отправку форм с невалидными данными.

Кроме того, как с placeholder и required, вы можете использовать значение этого атрибута для JS валидации в браузерах без поддержки.

Атрибут disabled

Булев атрибут disabled появился задолго до HTML5, но в этой спецификации он был значительно расширен. Атрибут работает со всеми полями формы за исключением нового output. В отличие от предыдущих версий HTML спецификация HTML5 позволяет устанавливать атрибут disabled на тег fieldset, тем самым применяя его ко всем тегам внутри набора.

Илон Маск рекомендует:  Создание уникальных значений ключа в interbase

Как правило, контент полей с disabled выделен серым цветом по умолчанию. Браузеры не разрешают полям с disabled получать фокус. С помощью этого атрибута часто отключают кнопку отправки формы до тех пор, пока не будут правильно заполнены все поля.

Стилизовать отключенные поля можно с помощью псевдокласса :disabled, активные поля с помощью :enabled или :not(:disabled).

Поля с атрибутом disabled не отправляются на сервер, т.е. вы не сможете их обработать. Если необходимо, чтобы пользователь видел значение и мог его отправлять, но не редактировал его, используйте атрибут readonly.

Атрибут readonly

Атрибут readonly похож на disabled: пользователю запрещается редактирование поля. Но в отличие от disabled такое поле может получить фокус, и его значение передается на сервер.

В форме комментариев можно добавить поля с URL страницы или заголовком статьи, на которую оставляется комментарий, давая пользователю понять, что мы собираем эту информацию без возможности ее менять:

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

Атрибут multiple


Наличие атрибута multiple указывает на то, что в поле можно вбить несколько значений. Атрибут был доступен и в предыдущих версиях HTML, но применялся только к тегу select. В HTML5 атрибут можно применять к типам file, email и range. Если атрибут есть, то можно выбрать более одного файла, прописать несколько адресов электронной почты через запятую. У диапазона в таком случае будет два слайдера.

Атрибут multiple для типа file поддерживается во всех браузерах с mobile Safari 7 и IE10, но на полях типа range на момент написания статьи данный атрибут еще не поддерживается ни в одном браузере.

Заметка: пробелы или запятые?

Вы могли заметить, что на клавиатуре на iOS в полях типа email разрешен пробел. Пробелы недопустимы в адресах, но браузеры разрешают разделять несколько адресов с помощью пробела и обязательной запятой. Изначально пробелы были запрещены в некоторых браузерах, но позже в спецификацию включили возможность добавления пробела после запятой.

Атрибут form

Не путать с тегом form. Атрибут form в HTML5 позволяет связать элементы с формами, в которые они не вложены. То есть теперь можно ассоциировать набор полей или одно поле с любой другой формой в документе. Этот атрибут решает старую проблему с невозможностью вкладывать формы. Сами формы все еще вкладывать нельзя, но можно ассоциировать «вложенные» поля с формой, которая не является им прямым родителем.

В качестве значения атрибут form принимает ID тега form, с которым нужно ассоциировать набор или одно поле.

Если атрибут отсутствует, поле будет передано вместе с той формой, в которую оно вложено. Если атрибут form был сначала добавлен, а потом удален, используйте el.removeAttribute(‘form’), а не el.setAttribute(‘form’, »). Если атрибут form вставлен, но пустой или ведет на неверный ID формы, поле будет исключено из отправки из всех форм, в том числе и из формы-предка.

Атрибут поддерживается во всех браузерах с Android 4 и IE 11.

Атрибут autocomplete

Атрибут autocomplete отвечает за то, будет ли форма или ее поля заполняться автоматически. Для большинства полей функционал реализуется через выпадающий список, который появляется, как только пользователь начинает печатать. С полями типа password атрибут сохраняет пароль в браузер.

Если autocomplete не указан в форме или полях, то значение по умолчанию ставится в on. Вы могли заметить это, когда последний раз заполняли форму. Для отключения автозаполнения используйте autocomplete=»off». Отличная идея для такой чувствительной информации, как номера кредитных карт или данные, которые нельзя повторно использовать, например, CAPTCHA.

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

Элемент datalist и атрибут list

Списки данных поддерживаются во всех браузерах, начиная с IE10 и Android 4.4.3 за исключением Safari. В стандартной форме они выполняют общие требования: текстовое поле с заданными опциями автозаполнения. В отличие от select пользователи могут вбить любое значение, но оно будет представлено с помощью заданного набора опций.

Рисунок 1 элемент datalist в Firefox

Для некоторых типов полей типа text и date выпадающий список опций появляется только после начала ввода, как показано на рисунке 4.4. Для типа range браузер будет показывать маленькую засечку возле слайдера, указывая на то, где найдены предлагаемые опции. Для типа color представлены образцы цвета с опцией переключения на стандартный пикер цвета для устройства, если нужно выбрать другой цвет.

Тег datalist, как и select, является списком опций, которые расположены в тегах option. Datalist ассоциируется с input с помощью атрибута list на инпуте. В качестве значения атрибут list принимает ID тега datalist. Тег datalist можно привязать к нескольким полям.

Тонкости свойства disable у кнопок формы, отправляемой на сервер (Как делать кнопки неактивными)

Уже неоднократно на хабре (вот в этой публикации и в этой) ставился вопрос о том, что было бы хорошо кнопкам формы, отправляемой на сервер, ставить свойство disabled = «disabled» .

Однако, до сих пор так и не разобрались, зачем это нужно и как все-таки это делать. Казалось бы, что может быть проще и о чем здесь вообще можно разговаривать, ан нет — на поверку все оказалось не так тривиально. Сразу замечу, что нижеследующие рассуждения применимы к обеим типам форм: как отправляемым через обычный SUBMIT, так и с помощью AJAX.

Зачем нужно делать кнопки неактивными

  1. Чтобы пользователю стало очевидным, что он уже нажал на кнопку, и что форма отправляется
  2. Чтобы сервер не загружался лишними запросами, и чтобы уменьшить вероятность какой-либо ошибки

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


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

Как делать кнопки неактивными

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

Илон Маск рекомендует:  Что такое код asp aspscripterrorsenttobrowser

Почему недостаточно просто делать нажатую кнопку неактивной:

  1. Submit формы может произойти и по нажатию на Enter. Поэтому обработку кнопок надо вешать на событие onsubmit самой формы. К тому же, у формы может быть несколько кнопок, и было бы логичным делать их все неактивными, а не только ту кнопку, которую нажали.
  2. Если после сабмита формы вновь вернуться на страницу с формой (по кнопке «Назад» в браузере), то сработает кеширование: мы столкнемся с неактивными кнопками и не сможем отправить форму еще раз — без принудительной перезагрузки страницы с потерей всех заполненных ранее полей (Возврат к поисковой форме со страницы результатов поиска тут живейший пример).
  3. Если у формы несколько кнопок (например, «Опубликовать» и «Отмена»), то мы не сможем передать серверу, какая именно кнопка была нажата: неактивная кнопка не передает свое имя и значение — даже если мы делаем ее неактивной по событию onsubmit

Итак, сценарий создания неактивных кнопок

Какая разница между disabled = «disabled» и readonly = «readonly» для полей ввода формы HTML?

Я немного читал об этом, но я не могу найти что-то твердое о том, как разные браузеры относятся к вещам.

readonly для form readonly элемент просто не редактируется, но отправляется, когда по form представляет. disabled элемент не редактируется и не отправляется при отправке. Другое отличие состоит в том, что элементы, доступные только для readonly могут быть сфокусированы (и фокусироваться при «вкладке» в форме), а disabled элементы — нет.

Подробнее об этом читайте в этой замечательной статье или в определении от w3c. Чтобы процитировать важную часть:

Атрибут Disabled

  • Значения для отключенных элементов формы не передаются в процессорный метод. W3C называет это успешным элементом (это работает аналогично флажкам формы, которые не отмечены).
  • Некоторые браузеры могут переопределять или предоставлять стиль по умолчанию для отключенных элементов формы. (Затенение или тиснение текста) Internet Explorer 5.5 особенно противен этому.
  • Отключенные элементы формы не получают фокус.
  • Отключенные элементы формы пропускаются при навигации по вкладкам.

Атрибут Только для чтения

  • Не все элементы формы имеют атрибут readonly. Наиболее примечательно, что элементы , и не имеют атрибутов только для чтения (хотя они оба имеют отключенные атрибуты)
  • Браузеры не предоставляют переопределенной визуальной обратной связи по умолчанию о том, что элемент формы доступен только для чтения. (Это может быть проблемой. см. Ниже.)
  • Элементы формы с установленным атрибутом readonly будут переданы в процессор форм.
  • Элементы только для чтения могут получить фокус
  • Элементы навигации только для чтения включены в навигацию с вкладками.

Проблема с input disabled?

В Crome, Safari и IE9 наблюдается такой баг (или может это фича): при попытки установить текстовое поле input в состояние disabled не получается точно установить цвет шрифта. Поверх указанного нами накладывается серая маска.

Кто-нибудь сталкивался, как побороли?

  • Вопрос задан более трёх лет назад
  • 4446 просмотров

Ага, то что надо. Не полноценная замена disabled, но в моем случае подойдет. Спасибо.
С JS слишком уж не хочется связываться.

HTML5 атрибуты форм (часть 2)


Дата публикации: 2020-03-09

От автора: данная статья является выдержкой из книги HTML5 и CSS3 для реального мира, 2-е издание за авторством Алексиса Гольдштейна, Луи Лазариса и Эстель Вейль. Книгу можно найти в магазинах по всему миру, а также купить цифровую версию.

Атрибут pattern

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

Язык регулярных выражений в шаблонах по синтаксису тот же, что и в JS на основе Perl за исключением того, что атрибут pattern должен удовлетворять всему значению, а не какому-то внутреннему набору. При использовании шаблонов пользователю необходимо сообщать разрешенные символы.

Глобальный атрибут title имеет особое значение в паре с pattern. В настоящий момент браузеры отображают значение атрибута title при наведении курсора в виде тултипа. Инструкции же в шаблоне более детальны, чем плейсхолдеры, и формируют более связное разъяснение. Атрибут title будет отображаться с сообщением об ошибке по умолчанию в браузерах с поддержкой нативной валидации. Об это мы поговорим в следующей главе.

Заметка: регулярные выражения

Регулярные выражения – функция большинства языков программирования, с помощью которой разработчики могут задавать шаблоны символов и проверять, подходит ли заданная строка под этот шаблон. Для новичков регулярные выражения просто темный лес. Например, выражение для проверки строки на значение цвета в формате hex выглядит следующим образом: #[A-Fa-f0-9]<6>.

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

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

В качестве базового примера давайте добавим атрибут pattern на поле с паролем в нашей форме. Нужно, чтобы пароль был минимум 6 символов без пробелов:

Запись \S означает «любой символ кроме пробела», а <6,>значит «минимум 6 раз». Хотите обозначить максимальное количество символов, можно использовать интервал, например, \S<6,10>.

Как и required, атрибут pattern запрещает отправку формы, если есть несоответствия с шаблоном. Также выскочит сообщение с ошибкой.

Если вы задали неправильное регулярное выражение, оно будет проигнорировано в целях валидации.

Атрибут pattern поддерживается в некоторой степени во всех браузерах, начиная с Firefox 4, Safari 5, Chrome 10, Opera 11, IE10 и Android 2.3. Под «в некоторой степени» понимается, что сейчас все браузеры поддерживают pattern. Однако Safari и Android до версии 4.4 позволяют отправку форм с невалидными данными.

Кроме того, как с placeholder и required, вы можете использовать значение этого атрибута для JS валидации в браузерах без поддержки.

Атрибут disabled

Булев атрибут disabled появился задолго до HTML5, но в этой спецификации он был значительно расширен. Атрибут работает со всеми полями формы за исключением нового output. В отличие от предыдущих версий HTML спецификация HTML5 позволяет устанавливать атрибут disabled на тег fieldset, тем самым применяя его ко всем тегам внутри набора.

Как правило, контент полей с disabled выделен серым цветом по умолчанию. Браузеры не разрешают полям с disabled получать фокус. С помощью этого атрибута часто отключают кнопку отправки формы до тех пор, пока не будут правильно заполнены все поля.

Стилизовать отключенные поля можно с помощью псевдокласса :disabled, активные поля с помощью :enabled или :not(:disabled).

Поля с атрибутом disabled не отправляются на сервер, т.е. вы не сможете их обработать. Если необходимо, чтобы пользователь видел значение и мог его отправлять, но не редактировал его, используйте атрибут readonly.

Илон Маск рекомендует:  Что такое код dbase_numfields

Атрибут readonly


Атрибут readonly похож на disabled: пользователю запрещается редактирование поля. Но в отличие от disabled такое поле может получить фокус, и его значение передается на сервер.

В форме комментариев можно добавить поля с URL страницы или заголовком статьи, на которую оставляется комментарий, давая пользователю понять, что мы собираем эту информацию без возможности ее менять:

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

Атрибут multiple

Наличие атрибута multiple указывает на то, что в поле можно вбить несколько значений. Атрибут был доступен и в предыдущих версиях HTML, но применялся только к тегу select. В HTML5 атрибут можно применять к типам file, email и range. Если атрибут есть, то можно выбрать более одного файла, прописать несколько адресов электронной почты через запятую. У диапазона в таком случае будет два слайдера.

Атрибут multiple для типа file поддерживается во всех браузерах с mobile Safari 7 и IE10, но на полях типа range на момент написания статьи данный атрибут еще не поддерживается ни в одном браузере.

Заметка: пробелы или запятые?

Вы могли заметить, что на клавиатуре на iOS в полях типа email разрешен пробел. Пробелы недопустимы в адресах, но браузеры разрешают разделять несколько адресов с помощью пробела и обязательной запятой. Изначально пробелы были запрещены в некоторых браузерах, но позже в спецификацию включили возможность добавления пробела после запятой.

Атрибут form

Не путать с тегом form. Атрибут form в HTML5 позволяет связать элементы с формами, в которые они не вложены. То есть теперь можно ассоциировать набор полей или одно поле с любой другой формой в документе. Этот атрибут решает старую проблему с невозможностью вкладывать формы. Сами формы все еще вкладывать нельзя, но можно ассоциировать «вложенные» поля с формой, которая не является им прямым родителем.

В качестве значения атрибут form принимает ID тега form, с которым нужно ассоциировать набор или одно поле.

Если атрибут отсутствует, поле будет передано вместе с той формой, в которую оно вложено. Если атрибут form был сначала добавлен, а потом удален, используйте el.removeAttribute(‘form’), а не el.setAttribute(‘form’, »). Если атрибут form вставлен, но пустой или ведет на неверный ID формы, поле будет исключено из отправки из всех форм, в том числе и из формы-предка.

Атрибут поддерживается во всех браузерах с Android 4 и IE 11.

Атрибут autocomplete

Атрибут autocomplete отвечает за то, будет ли форма или ее поля заполняться автоматически. Для большинства полей функционал реализуется через выпадающий список, который появляется, как только пользователь начинает печатать. С полями типа password атрибут сохраняет пароль в браузер.

Если autocomplete не указан в форме или полях, то значение по умолчанию ставится в on. Вы могли заметить это, когда последний раз заполняли форму. Для отключения автозаполнения используйте autocomplete=»off». Отличная идея для такой чувствительной информации, как номера кредитных карт или данные, которые нельзя повторно использовать, например, CAPTCHA.

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

Элемент datalist и атрибут list

Списки данных поддерживаются во всех браузерах, начиная с IE10 и Android 4.4.3 за исключением Safari. В стандартной форме они выполняют общие требования: текстовое поле с заданными опциями автозаполнения. В отличие от select пользователи могут вбить любое значение, но оно будет представлено с помощью заданного набора опций.

Рисунок 1 элемент datalist в Firefox

Для некоторых типов полей типа text и date выпадающий список опций появляется только после начала ввода, как показано на рисунке 4.4. Для типа range браузер будет показывать маленькую засечку возле слайдера, указывая на то, где найдены предлагаемые опции. Для типа color представлены образцы цвета с опцией переключения на стандартный пикер цвета для устройства, если нужно выбрать другой цвет.

Тег datalist, как и select, является списком опций, которые расположены в тегах option. Datalist ассоциируется с input с помощью атрибута list на инпуте. В качестве значения атрибут list принимает ID тега datalist. Тег datalist можно привязать к нескольким полям.

The disabled Attribute


The Current State of HTML5 Forms

Let Wufoo do the hard work. Sign up for a free account and start making forms the easy way.

Live Demo

Firefox Safari Safari Chrome
10+
Opera IE Android

The Low Down

The disabled attribute makes the ,

, and descendants non-editable and excludes the disabled form control data from being sent to the server.

  • If the disabled attribute is set on a , the descendent form controls are disabled.
  • A disabled field can’t be modified, tabbed to, highlighted, or have its contents copied. Its value is also ignored when the form goes thru constraint validation.
  • The disabled value is Boolean, and therefore doesn’t need a value. But, if you must, you can include disabled=»disabled» .
  • Setting the value of the disabled attribute to null does not remove the effects of the attribute. Instead use removeAttribute(‘disabled’) .
  • You can target elements that are disabled with the :disabled pseudo-class. Or, if you want to specifically target the presence of the attribute, you can use input[disabled] . Similarly, you can use :enabled and input:not([disabled]) to target elements that are not disabled.
  • You do not need to include aria-disabled=»true» when including the disabled attribute because disabled is already well supported. However, if you are programmatically disabling an element that is not a form control and therefore the disabled attribute does not apply, include aria-disabled=»true» .
  • The disabled attribute is valid for all form controls including all types,

Let Wufoo do the hard work.

Our Cookie Policy and Privacy Policy outline how we use cookies to help optimize service, personalize content, tailor and measure our marketing, and improve your user experience. I agree to use of cookies for these purposes.

HTML disabled attribute

disabled

The purpose of the HTML disabled attribute is to disable an element.

Using this attribute you can disable form controls. Once set, the element on which it is set, becomes grey.

Supported elements

HTML disabled attribute supports button, input, optgroup, option, select, textarea elements.

Syntax

Where ElementName is any supported element.

Type of value

Value

Default value

There is no default value of HTML disabled attribute.

Supported doctypes

HTML 4.01 strict, HTML 4.01 transitional, HTML 4.01 frameset.

Example of HTML disabled attribute with button, input, optgroup, option, select, textarea

Result

View this example in a separate browser window

Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL