¿Cuál es la diferencia entre deshabilitado="disabled" y readonly="readonly" para los campos de entrada de formulario HTML?
He leído un poco sobre esto, pero parece que no puedo encontrar nada sólido sobre cómo los diferentes navegadores tratan las cosas.
Un readonly
elemento simplemente no es editable, pero se envía cuando se form
envía el correspondiente. Un disabled
elemento no es editable y no se envía al enviarlo. Otra diferencia es que readonly
los elementos se pueden enfocar (y enfocarse al "tabular" un formulario) mientras que disabled
los elementos no.
Lea más sobre esto en este gran artículo o en la definición de w3c . Para citar la parte importante:
Diferencias clave
El atributo deshabilitado
- Los valores de los elementos de formulario deshabilitados no se pasan al método del procesador. El W3C llama a esto un elemento exitoso (esto funciona de manera similar a las casillas de verificación que no están marcadas).
- Algunos navegadores pueden anular o proporcionar estilos predeterminados para elementos de formulario deshabilitados. (Texto atenuado o en relieve) Internet Explorer 5.5 es particularmente desagradable en este sentido.
- Los elementos de formulario deshabilitados no reciben foco.
- Los elementos de formulario deshabilitados se omiten en la navegación con pestañas.
El atributo de sólo lectura
- No todos los elementos del formulario tienen un atributo de solo lectura. Lo más notable es que los elementos
<SELECT>
,<OPTION>
y<BUTTON>
no tienen atributos de solo lectura (aunque ambos tienen atributos deshabilitados)- Los navegadores no proporcionan información visual anulada predeterminada de que el elemento del formulario es de solo lectura. (Esto puede ser un problema... ver más abajo.)
- Los elementos del formulario con el atributo de solo lectura establecido se pasarán al procesador de formularios.
- Los elementos del formulario de solo lectura pueden recibir el foco
- Los elementos del formulario de solo lectura se incluyen en la navegación con pestañas.
No se activa ningún evento cuando el elemento tiene el atributo deshabilitado.
Ninguno de los siguientes se activará.
$("[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
Mientras que se activará el modo de solo lectura.
$("[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
Deshabilitado significa que no se enviarán datos de ese elemento del formulario cuando se envíe el formulario. Solo lectura significa que se enviará cualquier dato dentro del elemento, pero el usuario no podrá cambiarlo.
Por ejemplo:
<input type="text" name="yourname" value="Bob" readonly="readonly" />
Esto enviará el valor "Bob" para el elemento "tunombre".
<input type="text" name="yourname" value="Bob" disabled="disabled" />
Esto no enviará nada para el elemento "tunombre".
Igual que las otras respuestas (deshabilitado no se envía al servidor, solo lectura sí), pero algunos navegadores impiden resaltar un formulario deshabilitado, mientras que el de solo lectura aún se puede resaltar (y copiar).
http://www.w3schools.com/tags/att_input_disabled.asp
http://www.w3schools.com/tags/att_input_readonly.asp
Un campo de solo lectura no se puede modificar. Sin embargo, un usuario puede acceder a él, resaltarlo y copiar el texto.