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.

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.