前端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#
复制代码