HTML Reference Manual

HTML Tag Reference

HTML: <input> readonly attribute

The input readonly attribute is a boolean attribute. If present, it specifies that the input field is read-only. Setting the readonly attribute prevents the user from changing the value until certain conditions are met.

　HTML <input> tag

Online Example

HTML form with a read-only input field:

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML: <input> readonly attribute　-　基础教程网(oldtoolbag.com)</title>
<body>
<form action="action_page.php">
　　Email: <input type="text" name="email"><br>
　　Country: <input type="text" name="country" value="Norway" readonly><br>
　　<input type="submit" value="Submit">
</form>
</html>

Test it out ‹/›

Browser Compatibility

IEFirefoxOperaChromeSafari

All major browsers support the readonly attribute.

Definition and Usage

The readonly attribute is a boolean attribute.

If present, specifies that the input field is read-only.

Read-only input fields cannot be modified (but users can tab through them, highlight, and copy text from them).

You can set the readonly attribute to prevent users from changing the value until certain conditions are met (such as checking a checkbox, etc.). Then, JavaScript can remove the read-only value and make the input field editable.

Note:Forms will still submit read-only input fields, but will not submit disabled input fields!

HTML 4.01 With HTML5Differences

None.

Differences between HTML and XHTML

In XHTML, attribute shorthand is prohibited, the readonly attribute must be defined as <input readonly="readonly" />。

Syntax

<input readonly>

　HTML <input> tag

HTML: <template> tag