前端form表單：input輸入框disabled 和 readonly 屬性的區別

readonly和disabled的區別

readonly：

• 針對input(text / password)和textarea有效，在設置爲true的狀況下，用戶能夠得到焦點，可是不能編輯，在提交表單時，輸入項會做爲form的內容提交。

disabled：

• 針對全部表單元素（select，button，input，textarea等），在設置爲disabled爲true的狀況下，表單輸入項不能得到焦點，用戶的全部操做無心義，在提交表單時，表單輸入項不會被提交。

• disabled和readonly的文本輸入框只能經過腳本進行修改value屬性。

First name:

Last name:


full name:

<form action="#" onsubmit="onSubmit(event)">
First name:<br>
<input type="text" name="firstname" readonly value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
full name:<br>
<input type="text" name="fullname" disabled value="Mickey Mouse"> <br><br>
<input type="submit" value="Submit" >
</form> 
複製代碼

點擊button 以下：

https://juejin.im/editor/drafts/5cc1d8ec5188252d710bc3ab?firstname=Mickey&lastname=Mouse#
複製代碼