В чем разница между disabled="disabled" и readonly="readonly" для полей ввода HTML-формы?

Я немного читал об этом, но я не могу найти ничего твердого о том, как разные браузеры относятся к вещам. Я создаю приложение, которое должно быть совместимым с разделом 508 (доступно для чтения с экрана) и работать обратно в IE 6.

5 ответов


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

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

Ключевые Отличия

атрибут disabled

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

Атрибут Только Для Чтения

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

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

ни один из приведенных ниже не будет срабатывать.

$("[disabled]").click( function(){ console.log("clicked") });//No Impact
$("[disabled]").hover( function(){ console.log("hovered") });//No Impact
$("[disabled]").dblclick( function(){ console.log("double clicked") });//No Impact

пока readonly будет вызвано.

$("[readonly]").click( function(){ console.log("clicked") });//log - clicked
$("[readonly]").hover( function(){ console.log("hovered") });//log - hovered
$("[readonly]").dblclick( function(){ console.log("double clicked") });//log - double clicked

отключено означает, что данные из этого элемента формы не будут отправлены при отправке формы. Только для чтения означает, что любые данные из элемента будут отправлены, но не могут быть изменены пользователем.

например:

<input type="text" name="yourname" value="Bob" readonly="readonly" />

это отправит значение " Bob "для элемента"yourname".

<input type="text" name="yourname" value="Bob" disabled="disabled" />

это ничего не отправит для элемента "yourname".


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

то есть

<input type="textbox" name="field" value="field" disabled="disabled" />

разница

  • отключенные элементы управления не получают фокус.
  • отключена пропускаются в нашивая навигации.
  • отключенные элементы управления не могут быть успешно размещены.

используйте атрибут readonly, если вы хотите опубликовать поле данные.

то есть

<input type="textbox" name="field" value="field" readonly="readonly" />
  • читать-только элементы получают фокус, но не могут быть изменены пользователем.
  • элементы только для чтения включены в навигацию по вкладкам.
  • элементы только для чтения успешно разнесены.

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

http://www.w3schools.com/tags/att_input_disabled.asp

http://www.w3schools.com/tags/att_input_readonly.asp

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