表单标签
表单目的是为了收集用户信息。
在我们网页中, 我们也需要跟用户进行交互,收集用户资料,此时也需要表单。
在HTML中,一个完整的表单通常由表单控件(也称为表单元素)、提示信息和表单域3个部分构成。
例如:
表单组成部分
表单控件:input select textarea button
包含了具体的表单功能项,如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
提示信息:label
一个表单中通常还需要包含一些说明性的文字,提示用户进行填写和操作。
表单域: form
他相当于一个容器,用来容纳所有的表单控件和提示信息,可以通过他定义处理表单数据所用程序的URL地址,以及数据提交到服务器的方法。如果不定义表单域,表单中的数据就无法传送到后台服务器。
input 控件 (最常用)
在上面的语法中,<input> 标签为单标签,type属性为其最基本的属性,其取值有多种,用于指定不同的控件类型。除了type属性之外,<input >标签还可以定义很多其他的属性,其常用属性如下表所示。
常用属性 | 属性值 | 描述 |
---|---|---|
type | 见下表 | 控制input的类型 |
name | 自定义 | 控件名称 作为提交数据时的 key |
value | 自定义或输入 | input控件中的默认或用户输入的文本 |
size | 正整数 | input在页面中的显示宽度 |
checked | checked | 定义选择控件默认被选中的项 |
maxlength | 正整数 | 规定控件容许输入的最大字符数 |
required | required | 必填 |
readonly | readonly | 内容只读 |
placeholder | 文本 | 用户输入提示文本 |
multiple | multiple | 文件上传可选多文件 |
常用类型属性 | 描述 | 补充 |
---|---|---|
text | 单行文本输入框 | 明文 |
password | 密码输入框 | 密文 |
radio | 单选按钮 | 单选 |
file | 输入字段和 "浏览"按钮,供文件上传。 | multiple 属性可以开启多文件选择 |
checkBox | 复选框 | 多选 |
submit | 提交按钮 | 提交按钮会把表单数据发送到服务器 |
button | 普通按钮 | 多数情况下,用于通过js联动 |
reset | 重置按钮 | 重置按钮会清除表单中的所有数据 |
image | 图像形式的提交按钮。 | 自定义按钮 用的少 |
hidden | 隐藏的输入文本 | 输入不显示 防止窥屏 |
number 新增 | 仅限数字 | 只能输入数字 |
date 新增 | 日期选择 | 年/月/日 |
tel 新增 | 电话号码 | 非有效限制 |
time 新增 | 时间选择 | 00:00 |
email 新增 | 电子邮件 | 非有效限制 |
search 新增 | 查询框 | 可点击x清除内容 |
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。