我们在使用一个APP几乎都要经历的一步就是注册新用户,或者是在购买东西的时候,也要选择我们的收货地址,收件人,收件人电话等信息,这就是用到的表单
一、什么是表单:
1.表单主要作用:是用于显示、收集、提交用户信息到服务器上。
表单的组成:表单元素与表单的控件元素
2.表单
(1)语法:
虽然这个标记在网页上既看不见,也摸不到,但它负责将表单中出现的 表单控件元素的数据进行提交。如果表单控件元素不再表单标记中,那么数据将无法提交。
(2)属性
①id :定义表单在页面中的唯一标识
②name:定义表单的名称-JS中使用
③action:处理表单数据的服务器端处理程序的地址。通常都是由服务器端处理人员提供,默认值 为提交到本页
④method: 表单数据提交的方式。取值有
get为默认值,以明文的方式进行提交,数据会显示在地址栏上,安全性较低,有长度限制 2KB。get的使用场合是向服务器要数据的时候使用get提交方式。
post:以密文的方式进行数据的提交,所提交的数据不会显示在地址栏上,安全性较高适合提交用户的数据密码必须用post,无大小限制,大文件提交,大数据提交。 使用场合:提交数据让服务器去处理的时候,使用post。
⑤enctype:指定表达数据进行编码的方式(将什么样的数据提交个服务器)
取值:
application/x-www-form-urlencoded(默认值),允许 将提交数据中的 普通字符以及 特殊字符(?,=,&) 一并提交给服务器
multipart/form-data:允许将文件进行上传,文件上传时,enctype的值必须为multipart/form-data
二、表单控件
1.作用:提供 一组 允许 用户操作的控件,从而接收用户输入的数据
2.表单控件元素
(1)input 元素
展开全文
可以完成文本输入,按钮,单选按钮,复选框,文本选择框等的设计
语法: 或
(2)属性
①type:根据不同的type值,创建不同的input控件,可以是文本,密码,按钮形式
type取值:
文本框:,输入文本。
密码框:输入密码,就像我们在输入密码的时候为了保密,不会显示出来,而是以...的形式显示。
单选按钮: ,只能选择选项中的一个,列入我们在勾选性别的时候,只能从男或女中选择一个勾选,就是用到的单选按钮。
复选框:,可以勾选多个选择,;如我们的爱好,不只有一个,在给出的选项中可以选择多个。
提交按钮:,提交表单
重置按钮:,恢复到初始化状态
普通按钮: ,用户自定义效果
隐藏域:,将 一些 不想用户看的数据,但是要提交给服务器的数据 放在隐藏域 中
文件选择框:,method 必须为 post,enctype 值必须为 multipart/form-data
选项框:
-- 创建选项框
--创建选项框中的选项
单选按钮以复选框的name值 除表示名称之外,还表示分组信息。一组单选按钮或复选框,名称必须相同,否则不能实现想要的效果。
返回搜狐,查看更多