大前端技术,大前端是什么
HTML表单标签HTML表单用于收集用户输入的不同类型的数据，并上传到服务器。让我们一起来学习表单中最常用的标签。
1.字段集标签字段集标签用于在表单中划分区域和显示边框，起到分组的作用。例如，您可以将整个表单中的控件放入一个字段集标签中；您也可以将与表单中的功能相关联的几个控件放在同一个字段集中。
2.图例标签图例标签用于设置组的标题。一般来说，字段集和图例成对使用。
3.input标签input标签是表单中最通用的标签，下面的input元素都可以使用input实现。
对于单行文本框，只需将输入标签的类型属性设置为文本、密码输入框、数字输入框、邮箱输入框、邮件输入框、日期输入框、输入标签的类型即可。将属性设置为日期到时间输入框，将输入标签的类型属性设置为时间到颜色输入框，将输入标签的类型属性设置为颜色到单选到复选框，将输入标签的类型属性设置为复选框以上传文件，只需将输入标签设置为单选即可。您可以通过将输入标记的type属性设置为file来提交。您可以通过将输入标记的type属性设置为submit来重置它。您可以将输入标记的type属性设置为reset。4.select和option标签使用select和option标签实现下拉选择，比如用户注册时的省份选择。
5.文本区域标签文本区域标签可用于创建文本区域，供用户在HTML中输入。
表单的提交可以利用刚才提到的这些标签实现简单的表单页面；之后，我们需要将表单提交给服务器。这里介绍几个与表单提交相关的属性。
2.1操作处理表单数据的服务器的地址
2.2方法提交表单的方法常用的有get和post。
2.3 enctype enctype是指在将表单数据发送到服务器之前对其进行编码。它有三个值：
application/x-www-form-urlencoded:这是默认的方法，数据中的特殊字符在发送数据之前进行URL编码。比如把空格换成符号，特殊符号转换成ASCII十六进制值。Text/plain:这个值非常类似于application/x-www-form-urlencoded，它也将意味着空格被转换为" "加号，但是不编码任何特殊字符。multipart/form-data:表示字符没有被编码。当使用包含文件上载控件的表单时，必须使用该值。2.4目标提交表单数据后，服务器会做出相应的响应；因此，我们可以在浏览器中显示服务器返回的数据。那么，数据是显示在原来的窗口中吗？或者打开一个新窗口？此时，显示模式可以由目标属性指定。常用的目标属性值有：
_self表示在原窗口显示数据_blank表示在新窗口显示数据表单示例！声明文档类型
html lang=en
头
meta charset=UTF-8
Html表单/标题
/头
身体
表单id=userform 操作=您的url 方法=post
Title=用户注册表单 target= _ self enctype= multipart/Form-data
表单分组
图例用户注册信息/图例
英国铁路公司
昵称：输入类型= text name= un maxlength= 15 value= Tom
英国铁路公司
英国铁路公司
密码：输入类型=密码名称= pw 最大长度= 10
英国铁路公司
英国铁路公司
性别：输入类型=单选名称=性别值= m 选中=选中男性
类型=单选名称=性别值= w 女性
英国铁路公司
英国铁路公司
头像：输入id=用户照片类型=文件名称=个人资料
英国铁路公司
英国铁路公司
籍贯：选择姓名=省份
河北/选项
辽宁期权/期权
吉林期权/期权
云南期权/期权
选项selected=selected 广西/选项
/选择
英国铁路公司
英国铁路公司
爱好：输入name= hobby type= checkbox 阅读
Input= hobby type= checkbox 写
input= hobby type= checkbox checked= checked 弹钢琴
英国铁路公司
英国铁路公司
个人资料：
英国铁路公司
英国铁路公司
textarea name= introduce cols= 30 rows= 10 请在此输入简介/textarea。
英国铁路公司
英国铁路公司
个人网站：输入名称= userurl 类型=url
英国铁路公司
英国铁路公司
电子邮件：输入名称=用户电子邮件类型=电子邮件
英国铁路公司
英国铁路公司
体重：输入名称=用户体重类型=数字
英国铁路公司
英国铁路公司
出生日期：输入姓名=用户日期类型=日期
英国铁路公司
英国铁路公司
详细信息：输入名称=usertime 类型=time
英国铁路公司
英国铁路公司
颜色：输入类型=颜色名称=用户颜色
英国铁路公司
英国铁路公司
输入类型=提交值=开始注册
输入类型=重置值=重置信息
英国铁路公司
英国铁路公司
/字段集
/表单
/body
/html
HTML5中表单的新特性表单属性在HTML5之前，所有的表单标签都必须放在表单标签中。但是，HTML5中添加了一个新的form属性来指示标签所属的form标签。因此，每个标签不一定要放在表单标签中才能成为表单的一部分，只需将标签的form属性值设置为它所属表单的id即可。比如刚才的例子，再加一个输入框，记录毕业学校。
研究生院：输入type= text name= school form= userform 代码如上图，那么输入标签也属于userform表单；也将被提交到服务器。
Datalist label datalist label用于显示文本框与下拉菜单结合的效果。请注意，datalist的id值必须是form form的列表属性值。请看下面的例子：
！声明文档类型
html lang=en
头
meta charset=UTF-8
标题列表标签/标题
/头
身体
表单操作=url 方法=get
请输入你最喜欢的女演员：输入type= text name= name list= names list
/表单
datalist id=namesList
Option= lbb 李冰冰/option
Option= fbb 范冰冰/option
Option= gyy 高圆圆/option
/数据列表
/body
/html
Formxxxx属性为了更方便的控制表单标签，HTML5中增加了几个formxxxx属性，简单介绍如下：
Formaction属性用于指定表单提交的地址，formmethod属性用于指定表单提交的方式，formtarget属性用于指定打开服务器响应URL的方式，formenctype属性用于指定表单数据提交的编码方式！声明文档类型
html lang=en
头
meta charset=UTF-8
标题HTML表单中的formxxx属性/标题
/头
身体
形式
用户名：输入类型=text 名称=un
英国铁路公司
英国铁路公司
密码：输入类型=密码名称=pw
英国铁路公司
英国铁路公司
type= submit value= regist for action= regist URL form method= get form target= _ self formenctype= application/x-www-form-urlencoded
type= submit value= log in for action= log in URL form method= post form target= _ blank formenctype= multipart/form-data
/表单
/body
/html
在这个例子中，有两个函数：登录和注册；不同的功能有不同的动作、方法、目标和类型。formaction、formmethod、formtarget和formenctype属性灵活指定不同操作下不同的表单提交方式。
版权归作者所有：博主曲乐优香原创作品，转载授权请联系作者，否则将追究法律责任。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。