前面介绍了HTML from表单的一些元素,今天我们来聊聊最常用到的input元素有哪些类型。
文本输入Type类型:text 定义供文本输入的单行输入字段。
<input type="text">
密码输入Type类型:password 定义密码输入字段(输入内容为不可见)。
<input type="password">
按钮输入Type类型:submit 定义提交表单数据至表单处理程序的按钮(可以设置value属性来更改按钮文本,如缺失value属性则使用默认文本)。
<input type="submit">
单选按钮输入 Type 类型:radio 定义单选按钮。
<input type="radio">
多(复)选按钮输入 Type 类型:checkbox 定义复选按钮。
<input type="checkbox">
另外在 HTML5 新增了一些 Type 类型:
数字输入 Type 类型:number 定义只能输入数字字段(目前IE9浏览器及更早版本暂不支持)。
<input type="number">
颜色模块输入 type 类型:color 定义颜色选择器(目前IE浏览器暂不支持)。
<input type="color">
滑条模块输入 type 类型:range 定义滑动条模块,用属性min、max设置范围(目前IE9浏览器及更早版本暂不支持)。
<input type="range" min="0" max="10">
日期模块输入 type 类型:date 定义只能输入日期字段(日期模块date 精确到日,还有拓展属性:min、max,可以设置输入范围,目前IE浏览器暂不支持)。
<input type="date">
<input type="date" min="1979-12-31" max="2000-01-02">
日期模块输入 type 类型:month 定义只能输入日期字段(日期模块month 精确到月,目前火狐和IE11浏览器及更早版本暂不支持)。
<input type="month">
日期模块输入 type 类型:week 定义只能输入日期字段(日期模块week 选择年份及周数,目前IE浏览器暂不支持)。
<input type="week">
时间模块输入 type 类型:time 定义只能输入时间字段(24小时制,无时区,目前火狐和IE11浏览器及更早版本暂不支持)。
<input type="time">
日期模块输入 type 类型:datetime 定义只能输入日期字段(有时区,但目前谷歌、火狐和IE浏览器暂不支持)。
<input type="datetime">
日期时间模块输入 type 类型:datetime-local 定义只能输入日期时间字段(有时区,但目前火狐和IE浏览器暂不支持)。
<input type="datetime-local">
邮箱模块输入 type 类型:email 定义只能输入邮箱字段(IE9及更早版本浏览器暂不支持)
<input type="email">
搜索模块输入 type 类型:search 定义只能输入搜索字段(不知结果是用哪个搜索引擎)
<input type="search">
电话模块输入 type 类型:tel 定义只能输入电话数字字段(只有safari8及更新版本浏览器支持)
<input type="tel">
如果你发现错误或有其他见解,请给www.zhuei.com留言,我们会尽快更新本文!