HTML表单input类型有哪些,HTML表单之input元素的23种type
类型
了解HTML表单之input元素的23种type类型
随着HTML5的出现,input元素新增了多种类型,⽤以接受各种类型的⽤户输⼊。
其中,button、checkbox、file、hidden、image、password、radio、reset、submit、text这10个是传统的输⼊控件,
新增的有color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week共13个
传统类型
text-------定义单⾏的输⼊字段,⽤户可在其中输⼊⽂本
password---定义密码字段。该字段中的字符被掩码
file----定义输⼊字段和 "浏览"按钮,供⽂件上传
radio----定义单选按钮
checkbox---定义复选框
hidden---定义隐藏的输⼊字段
button---定义可点击按钮(多数情况下,⽤于通过JavaScript启动脚本)
image---定义图像形式的提交按钮
reset---定义重置按钮。重置按钮会清除表单中的所有数据
submit---定义提交按钮。提交按钮会把表单数据发送到服务器
text
type="text"表⽰⼀个⽂本输⼊框,它是默认的输⼊类型,是⼀个单⾏的控件,⼀般是⼀个带有内嵌框的矩形
password
type="password"表⽰⼀个密码输⼊框,它与⽂本输⼊框⼏乎⼀模⼀样,功能上唯⼀的不同的字母输⼊后会被隐藏,⼀般是⼀连串的点
******
file
type="file"定义输⼊字段和"浏览"按钮,⽤于⽂件上传
radio
type="radio"定义单选按钮,允许⽤户从给定数⽬的选择中选⼀个选项。同⼀组按钮,name值⼀定要⼀致
checkbox
type="checkbox"定义多选按钮,允许⽤户在给定数⽬的选择中选择⼀个或多个选项。同⼀组的按钮,name取值⼀定要⼀致
hidden
type="hidden"定义隐藏输⼊类型⽤于在表单中增加对⽤户不可见,但需要提交的额外数据
[注意]disabled属性⽆法与type="hidden"的input元素⼀起使⽤
说明:点击提交按钮后,隐藏域的内容'test=12#'会包含在URL中
button
type="button"的input输⼊类型定义可点击的按钮,但没有任何⾏为,常⽤于在⽤户点击时启动javascript程序
image
type="image"的input输⼊类型定义图像形式的提交按钮,该类型可以设置width、height、src、alt这四个属性
⽤图⽚作为提交按钮会⼀起发送点击在图⽚上的x和y坐标,这样可以与服务器端图⽚地图结合使⽤,如果图⽚有name属性,也会随坐标发送
submit
type="submit"的input输⼊类型⽤于创建提交表单的按钮
reset
type="reset"的input输⼊类型⽤于创建重置表单的按钮
新增类型
color----定义调⾊板
tel-----定义包含电话号码的输⼊域
email---定义包含email地址的输⼊域
url-----定义包含URL地址的输⼊域
search--定义搜索域
html中提交表单用什么属性number--定义包含数值的输⼊域
range---定义包含⼀定范围内数字值的输⼊域
date----定义选取⽇、⽉、年的输⼊域
month---定义选取⽉、年的输⼊域
week----定义选取周、年的输⼊域
time----定义选取⽉、年的输⼊域
datetime----定义选取时间、⽇ ⽉、年的输⼊域(UTC时间)
datatime-local--定义选取时间、⽇ ⽉、年的输⼊域(本地时间)
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论