Introduction to the difference between readonly and disabled in input in javascript_form effects

Readonly and Disabled are two attributes used in forms. They both prevent users from changing the content of form fields. But there are slight differences between them, which are summarized as follows:

Readonly is only valid for input (text / password) and textarea, while disabled is valid for all form elements, including select, radio, checkbox, button, etc. . However, after the form element is disabled, when we submit the form by POST or GET, the value of this element will not be passed out, and readonly will pass the value out (this situation occurs when we submit a certain The textarea element in the form is set to disabled or readonly, but the submit button can be used).

Example

js control code



Example



Attribute value description disabled disabled

Disable this element when the input element is first loaded, so that the user cannot write text in it, or select it.
Note: Cannot be used with type="hidden".

readonly readonly
indicates that the value of this field cannot be modified.
Note: Only works with type="text".

Summary

readonly code:
readonly is not editable, Can be copied, selectable, can receive focus but cannot be modified, and the passed value will be received in the background.
disabled code:
disabled cannot be edited, copied, selected, cannot receive focus, and the value will not be received in the background.