The summary is 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).
Generally common situations are:
① A unique identification code is pre-filled for the user in a form, and the user is not allowed to change it, but the value needs to be passed when submitting. At this time, its value should be passed The attribute is set to readonly
② It is often encountered that when the user formally submits the form, he needs to wait for the administrator's information verification. This does not allow the user to change the data in the form, but can only view it. Due to the scope of disabled elements, the user is not allowed to change the data in the form. large, so disabled should be used at this time, but at the same time, it should be noted 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 be cleared. If readonly is used instead of disabled in this case, it is still possible if there are only input (text/password) and textarea elements in the form. If there are other elements, such as select, the user can rewrite the value and press Press the Enter key to submit (Enter is the default submit trigger key)
③We often use JavaScript to disable the submit button after the user presses the submit button. This can prevent users from repeatedly pressing the submit button in an environment with poor network conditions. Clicking the submit button causes the data to be redundantly stored in the database.