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 个,其余按需使用。