input中type属性有哪些：全覆盖类型及使用场景

input中type属性包含18种常用合法取值，分别为text、password、submit、reset、button、hidden、radio、checkbox、file、image、date、time、datetime-local、month、week、number、tel、email，不同类型对应不同表单输入功能，适配网页所有常规录入、提交、选择场景，其中HTML5新增的时间、数值类类型仅兼容2015年后主流浏览器，老旧IE浏览器无法正常识别渲染。

input基础文本与密码type属性

text是默认输入类型，也是网页最常用的输入框，用于接收单行普通文本内容，适配用户名、昵称、地址等无格式短文本录入，输入内容无字符隐藏效果，可自由输入字母、数字、符号和汉字，默认支持文本复制、粘贴、选中操作。

password专属密码输入场景，输入的内容会自动替换为黑点或星号隐藏，保障隐私安全，该类型仅隐藏视觉展示，不会加密传输数据，后台接收数据时仍需自行配置加密规则，不适合用于需要明文展示的输入场景。

input按钮与隐藏type属性

submit用于生成表单提交按钮，点击后会自动触发form表单的提交事件，将表单内所有合法输入数据上传至后台，按钮默认自带浏览器原生样式，无需额外配置点击事件即可生效。

reset为表单重置按钮，点击后会一键清空表单所有输入框内容，恢复页面初始默认状态，仅对所在form标签包裹的表单内容生效，独立放置无任何作用。

button是通用自定义按钮，无默认功能，所有点击效果都需要通过JavaScript代码自定义实现，灵活性较高，广泛用于弹窗触发、局部数据校验、页面交互等自定义场景。

hidden为隐藏域，页面无任何可视化展示，用户无法操作，仅用于开发者传递固定后台参数，比如页面标识、默认参数、校验密钥等，不会占用页面布局空间。

input选择与文件type属性

radio为单选框，同一name属性值的radio选项为一组，组内只能选择一个选项，常用于性别、学历、单一选项筛选等互斥选择场景，点击已选中的选项无法取消选择，只能切换其他选项。

checkbox为复选框，支持多选、取消选，无同组互斥限制，适配爱好、标签、多项条件勾选等多选项场景，可单独设置默认选中状态，适配多元选择需求。

file是文件上传输入框，可唤起本地文件选择窗口，支持单文件或多文件上传，可通过accept属性限制上传文件格式，常用于头像上传、资料提交、文档导入等网页功能。

image为图片提交按钮，功能等同于submit，可通过src属性设置自定义按钮图片，替代原生默认按钮样式，兼顾提交功能和页面视觉美化需求。

inputHTML5新增type属性

HTML5新增的表单输入类型大幅提升了移动端适配性，无需JS即可实现基础格式校验，主流适配场景和特性可通过表格清晰区分。

该系列新增属性的适用边界为仅支持HTML5标准规范的浏览器，根据W3C2014版HTML5表单规范，老旧浏览器会自动将不识别的type类型降级为text文本输入框，丧失专属功能和格式校验效果。

tel类型无强制校验规则，是所有数值类输入类型中容错性最高的选项，仅优化移动端输入体验。