HTML表单输入字段包含两个比较相似的属性:disabled="disabled"以及readonly="readonly",它们之间的区别如下:
a readonly element is just not editable, but gets sent when the according form submits. a disabled element isn't editable and isn't sent on submit. another difference is that readonly elements can be focused (and getting focused when "tabbing" through a form) while disabled elements can't.
设为readonly(只读)的元素只是不可编辑的,但是当表单提交时其内容会被提交。disabled(禁用)的元素除了不可编辑之外,在表单提交时也不会被提交。另外一个区别是只读元素可以被聚焦(focused,在表单上使用Tab键进行切换时),而被禁用的元素不能获取焦点。
read more about this in this great article or the definition by w3c. to quote the important part:
阅读这篇文章和w3c的定义来了解更多内容,下面是对重点部分的摘录:
关键区别 Key Differences
禁用属性 The Disabled attribute
- 被禁用的表单元素的值不会传给处理器方法。W3C将此称为一个成功的元素。(这与未被选中的表单复选框的处理方法相似)
Values for disabled form elements are not passed to the processor method. The W3C calls this a successful element.(This works similar to form check boxes that are not checked.)
- 某些浏览器可能会覆盖或者提供禁用表单元素的缺省样式。(灰显或者浮雕文字样式)IE 5.5对此尤其讨厌。
Some browsers may override or provide default styling for disabled form elements. (Gray out or emboss text) Internet Explorer 5.5 is particularly nasty about this.
- 被禁用的表单元素不接受聚焦。
Disabled form elements do not receive focus.
- 被禁用的表单元素在Tab切换导航时会被跳过
Disabled form elements are skipped in tabbing navigation.
只读属性 The Read Only Attribute
- 并非所有的表单元素都拥有只读属性。最明显的,<SELECT> , <OPTION> , 以及 <BUTTON>元素没有只读属性(不过它们都也拥有禁用属性)。
Not all form elements have a readonly attribute. Most notable, the <SELECT> , <OPTION> , and <BUTTON> elements do not have readonly attributes (although thy both have disabled attributes)
- 许多浏览器对只读元素不提供缺省的视觉反馈(这可能会成为一个问题...看下面)
Browsers provide no default overridden visual feedback that the form element is read only. (This can be a problem… see below.)
- 拥有只读属性的表单元素集会被传递给表单处理器。
Form elements with the readonly attribute set will get passed to the form processor.
- 只读表单元素可以获取焦点
Read only form elements can receive the focus
- 只读表单元素可以通过Tab切换导航
Read only form elements are included in tabbed navigation.
本文链接:http://bookshadow.com/weblog/2014/10/11/whats-the-difference-between-disabled-and-readonly/
请尊重作者的劳动成果,转载请注明出处!书影博客保留对文章的所有权利。