El atributo readonly en Html5

Este otro atributo readonly es muy parecido al anterior, al atributo disabled. Con el anterior lográbamos desactivar un campo, evitando poder escribir sobre él. Además, el valor en su interior (normalmente nulo pues el visitante no puede escribir sobre él) no es enviado junto con los datos del formulario. Con el atributo readonly en cambio sí que es enviado. Lo que ocurre es que el usuario no puede escribir dentro de él, sino que somos nostros como programadores o webmaster quienes hemos colocado ya el valor que deseamos que sea enviado.

Es parecido a cuando colocábamos la propiedad hidden con la diferencia de que en este caso el visitante sí que puede leer el valor que hemos colocado. Recuerdas cuando hablabamos del uso del hidden?

Os muestro un ejemplo. El segundo campo del siguiente formulario tiene el atributo readonly, como puedes ver después en el código correspondiente a este ejemplo de abajo:

Dato1:
Dato2:
Dato3:
<form>
   Dato1: <input type="text" name="name1">
   Dato2: <input type="text" name="name2" value="Dato de solo lectura" readonly>
   Dato3: <input type="text" name="name3">
   <input type="submit" value="enviar">
</form>