Make Input or Textarea Read-Only in HTML
- 1 minute read
By adding the
readonly attribute to an input
element or a textarea
element in HTML, you can prevent the contained value from being edited:
<input readonly value="You can't edit me!">
<textarea readonly>You can't edit me!</textarea>
The readonly
differs from the disabled
attribute, but the difference is purely stylistic (browsers typically gray out fields with the disabled
attribute).
Conclusion
That’s all!
One of many example use cases is presenting the user with an input that contains a SMS verification code to be copied, but not edited.