表单系列之input类型与属性简介

input类型

传统类型

• text：
• file:
• button:
• hidden:
• submit:
• reset:
• password:
• radio:
• checkbox:
• image:
• email：
• range：
• date：
• time：
• month：
• week：
• datetime：
• datetime-local：
• color：
• url:
• tel:
• search:

input属性

传统属性

• accept
• alt
• checked
• disabled
• maxlength
• name
• readonly
• size
• src
• type
• value

readonly

作用：规定输入字段为只读
用法：readonly="readonly"
只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本

readonly 与 disabled区别

readonly

• 只针对input(text / password)和textarea有效
• 提交表单时，接受值更改并且可以回传
• 可以接收焦点但不能被修改
• 可以使用tab键进行导航

disabled

• disabled对于所有的表单元素都有效
• 不能接收焦点，用户的所有操作（鼠标点击和键盘输入等）对该输入项都无效
• 使用tab键时将被跳过
• 提交表单时，接受更改但不回传数据

HTML5

• autocomplete
• autofocus
• form
• formaction
• formenctype
• formmethod
• formnovalidate
• formtarget
• height
• list
• max
• min
• multiple
• novalidate
• pattern
• placeholder
• required
• step
• width

autofocus

作用：使input自动获取焦点，当页面加载时 input 元素应该自动获得焦点
用法：autofocus = "autofocus"
注：IE 9 及之前的版本不支持

autocomplete

用法：autocomplete="on"