Cloud Cloud Cloud Cloud

The readonly 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

Text input

Textarea


Firefox

Safari

Safari

Chrome

Opera

IE

Android

The Low Down

The readonly attribute makes a form control non-editable (or “read only”).

  • A read-only field can’t be modified, but, unlike disabled, you can tab into it, highlight it, and copy its contents.
  • Setting the value to null does not remove the effects of the attribute. Instead use removeAttribute('readonly').
  • You can target elements that are read only with the :read-only pseudo-class, and its writability with the :read-write pseudo-class. Or, if you want to specifically target the presence of the attribute, you can use input[readonly] and input:not([readonly]).
  • readonly is only relevant for type text, search, url, tel, email, number, password, and the date/time input types. It is also valid on <textarea>
  • readonly is ignored for type hidden, range, color, checkbox, radio, file, button, submit and image.
Cloud Cloud Cloud Cloud

Let Wufoo do the hard work.

Sign up for a free account and start making forms the easy way.