在实际应用中，可能要设置表单元素为内容是不可更改的，标题中的两个属性都可以实现此功能。
代码如下:
|
01
02
03
04
05
06
07
08
09
10
11
12
|
<!DOCTYPE html>
<
html
>
<
head
>
<
meta
charset
=
" utf-8"
>
<
title
>蚂蚁部落</
title
>
</
head
>
<
body
>
<
input
type
=
"text"
disabled
value
=
"蚂蚁部落一"
/>
<
input
type
=
"text"
readonly
value
=
"蚂蚁部落一"
/>
</
body
>
</
html
>
|
上面代码使用两个属性可以将文本框设置不可更改的状态，使用键盘和鼠标是不能修改文本框的内容。
两个属性的区别:
虽然两个属性功能上有相似之处，但是区别还是非常巨大的，下面就简单做一下列举。
1.两个属性在元素上的渲染效果不同，这个自然一目了然。
2.disabled是设置元素"不可用"，比较狠一点，相应元素的value属性值不能够通过表单提交，也不能够使用js代码去动态修改value属性值，readonly是设置元素为只读，可以通过表单提交相应的值，也可以使用js动态修改value属性值。
原文发布时间为：2017-2-20
本文作者：admin
本文来自云栖社区合作伙伴“蚂蚁部落”，了解相关信息可以关注蚂蚁部落
原文链接：disabled和readonly属性的区别是什么
