Input read-only property details
1.1 Overview
Both Readonly and Disabled can make the user unable to change the content of the form field.
1.2 The difference between Readonly and Disabled
1. Readonly is only valid for input[type="text / password"] and textarea, while disabled is valid for all form elements.
2. After setting the disabled attribute, when the form is submitted by POST or GET, its value will not be passed out, but readonly will pass the value out (readonly accepts the value change and can return it, disable accepts the change but does not return it. data).
3. If an input item is set disabled to true, the form input item cannot get the focus, and all user operations (mouse click and keyboard input, etc.) are invalid for this input item. If readonly is set to true, the user just cannot edit the corresponding text, but can still focus.
1.3 The actual situation explains
the common situation:
when a unique identification code is pre-filled for the user in a form, the user is not allowed to change it, but the value needs to be passed when submitting, and its attribute should be set to readonly.
When the user formally submits the form, he needs to wait for the administrator's information verification. At this time, the user is not allowed to change the data in the form, but can only view it. Due to the large scope of the function elements of disabled, disabled should be used at this time. Note that the submit/button should also be disabled, otherwise as long as the user presses this button, if there is no integrity check in the database operation page, the value in the database will be cleared.
After the user presses the submit button, use javascript to disable the submit button, which can prevent the user from repeatedly clicking the submit button in an environment with poor network conditions, causing the data to be redundantly stored in the database.