HTML 中的 <input>
标签是表单中最常用的元素之一,拥有超过 50 个属性(包括全局属性和专用属性)。以下是分类整理的核心属性列表:
一、通用属性(所有 <input>
类型共用)
-
基础属性
type
:输入类型(如text
,password
,email
,checkbox
,radio
,file
,submit
等,共约 23 种)。name
:字段名称(表单提交的键名)。value
:默认值。disabled
:禁用输入。readonly
:只读(不可编辑)。autofocus
:页面加载自动聚焦。placeholder
:提示文本。required
:必填字段。form
:关联的表单 ID(可脱离<form>
标签使用)。
-
事件处理属性
onclick
,onchange
,oninput
,onfocus
,onblur
等(用于 JavaScript 交互)。
-
全局 HTML 属性
class
,id
,style
,title
,data-*
(自定义数据属性)等。
二、类型相关属性(根据 type
变化)
-
文本类输入(
text
,password
,email
,search
等)maxlength
:最大字符数。minlength
:最小字符数。pattern
:正则验证(如[A-Za-z]{3}
)。size
:显示宽度(字符数)。
-
数值/范围输入(
number
,range
)min
:最小值。max
:最大值。step
:步长(如0.1
)。
-
日期时间输入(
date
,time
,datetime-local
)min
/max
:日期范围(格式如2024-01-01
)。
-
文件上传(
file
)accept
:允许的文件类型(如.jpg
,image/*
)。multiple
:允许多文件上传。
-
复选框/单选按钮(
checkbox
,radio
)checked
:默认选中。
-
按钮类(
submit
,reset
,button
)formaction
,formenctype
,formmethod
:覆盖表单的提交行为。
三、现代 HTML5 新增属性
autocomplete
:自动填充(如on
/off
)。list
:关联<datalist>
提供下拉选项。inputmode
:虚拟键盘类型(如numeric
,email
)。dirname
:提交文本方向(如ltr
/rtl
)。formtarget
:覆盖表单的target
(如_blank
)。
四、不常用但有用的属性
src
(type="image"
):图片按钮的 URL。usemap
:关联图像映射。webkitdirectory
(非标准):上传目录(仅 Chrome)。
总结
- 核心属性约 20 多个(如
type
,name
,value
等)。 - 类型专用属性约 10+ 个(如
min
,max
,accept
)。 - 全局属性(如
class
,id
)和事件属性未计入总数。
完整列表可参考 MDN Input 文档。实际开发中,常用属性约 15-20 个,其余按需使用。