readonly (HTML attribute)
Example
Thereadonly
attribute stops the input data from being changed:
<form> <label for="town">Postal Town:</label> <input type="text" name="town" id="town" readonly="readonly" value="Southampton" /> </form>
Description
The
"readonly" attribute stops the user from changing the
value of an input (in the case of a text input or
password), but does not stop the user interacting with the form
control content - it is possible to click inside the
input, tab to it, highlight the text inside and even
copy/paste that content, but it just cannot be changed/cleared.
The
most likely use for this attribute is to stop the user from interfering
with the value of an input until such a time as some
other condition has been met (e.g. a checkbox is ticked to confirm terms
and conditions), at which point JavaScript would be required to removed
the "readonly" value, making the form control
completely usable.
Value
"readonly"
only
Compatibility
| IE | 5.5 | Full |
|---|---|---|
| 6.0 | Full | |
| 7.0 | Full | |
| Firefox | 1.0 | Full |
| 1.5 | Full | |
| 2.0 | Full | |
| Safari | 1.3 | Full |
| 2.0 | Full | |
| 3.0 | Full | |
| Opera | 9.2 | Full |
| 9.5 | Full |
Causes no compatibility issues. It has excellent support across all tested browsers.
User-contributed notes
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.

