第3讲 表单设计WEB交互会话控制.docx
- 文档编号:24397998
- 上传时间:2023-05-27
- 格式:DOCX
- 页数:14
- 大小:385.42KB
第3讲 表单设计WEB交互会话控制.docx
《第3讲 表单设计WEB交互会话控制.docx》由会员分享,可在线阅读,更多相关《第3讲 表单设计WEB交互会话控制.docx(14页珍藏版)》请在冰豆网上搜索。
第3讲表单设计WEB交互会话控制
第三讲表单设计\Web交互\会话控制
表单设计
网页设计中表单(form)是程序和用户交互的主要一个途径,一般用来接收用户的输入值。
在HTML语言中,我们使用
标签来定义一个表单。用HTML写下如下HTML代码:
在HTML语言中,使用
来定义一个表单,关于Form标签有如下属性:•id:
在网页当中有多个表单的情况下唯一的识别该表单
•name:
作用和id一样但id还有一个重要的作用就是做css的选择器
•action:
表明表单提交之后由谁来处理
•method:
表单页面和处理页面间数据的传送方式一般有post和get两种方法。
•target:
设置返回信息的显示方式
•enctype:
设置表单的编码方式,上传文件设置为enctype="multipart/form-data"
而在Form标签内空间元素常用的有如下几种:
表单元素
说明
inputtype="checkbox"
复选框,允许用户选择多个选择项
inputtype="file"
文件浏览框,当文件上传时,可用来打开一个模式窗口以选择文件
inputtype="hidden"
隐藏标签,用于在表单中以隐含方式提交变量值
inputtype="password"
密码文本框,用户在该文本框输入字符时将被替换显示为*号
inputtype="radio"
单选项,用于设置一组选择项,用户只能选择一个
inputtype="reset"
清除与重置表单内容,用于清除表单中所有文本框的内容,而且使选择菜单项恢复到初始值
inputtype="submit"
表单提交按钮
inputtype="text"
单行文本框
select
下拉列表框,可单选和多选。
默认为单选,如果增加多项选择功能,增加
option
列表下拉菜单,和select配合使用,显示供选择的值
textarea
多行文本框,在使用文本框时需要关闭标签之间的文本内容,形成如下格式:
表单中常见的元素的属性有如下:
属性名称
说明
name
文本框的名称,PHP根据该名称,在超级全局数组中建立以name为名称的键名
size
文本框的宽度,在select下拉菜单中,表示可以看到的选项行数
value
文本框中的默认值,注意,该值不能应用到type=file文件文本框中
multiple
此属性用于下拉列表菜单select中,指定该选项用户可以使用Ctrl和Shift键进行多选
rows
多行文本框显示时可以容纳的字符行数高度
cols
多行文本框显示时可以容纳的字符列数宽度
其他常用元素属性有:
●maxlength
●enctype=“multipart/form-data”
●checked
●selected
maxlength:
用于控制文本的长度
enctype=”multipart/form-data”:
文件上传用该属性
checked:
单选框/复选框选中属性
selected:
列表默认选项值
页面交互
在PHP开发的WEB应用程序中,所有非PHP代码以及输出语句中的内容都会被输出,那么程序又是如何接收输入内容的呢?
相信不少人一定想到了 WEB表单!
在HTTP协议下,输入输出的原型其实是HTTP请求与响应,客户端向服务器端发送的数据称之为请求,反之称为响应。
虽然HTTP/1.1定义了7种请求方法,但真正常用的却只有在HTTP/0.9种就已经有的两种方法——GET和POST,它们都允许发送自定义数据给服务器端。
因此,可以通过接收这两种方法的请求数据,来实现输入。
一、 $_GET数组
GET是HTTP中最原始的请求方式,在网页中点击一个超级链接或在地址栏输入一个URL都会发送一个GET请求。
在GET请求中,数据是后缀在URL后面来发送的,就好像这样:
http:
//localhost/request.php?
id=root&password=asdfl。
PHP将GET请求封装在了$_GET数组中,请求的变量名是数组的下标,要接收上面那个请求传递的两个变量id和password,使用$_GET['id'] 和$_GET['password']即可。
请看下面的例子:
# login.html文件
#get.php文件
get.php文件中有一个表单,它将使用默认的GET方法发送请求,其效果与上面看到的URL是相同的。
请注意文件一开始的PHP代码段:
它首先判断请求变量get是否存在(是否点击了name属性为get的提交按钮),如果存在则输出请求的变量。
由于在第一次打开文件时,变量get不存在,因此开头的PHP代码根本不会被执行,而直接输出表单。
当提交表单后,PHP代码得到执行,用户输入的两个变量也会被输出。
有时候,在程序中并不能确定客户端提交了哪些数据过来,那么怎么样在不知道请求变量名字的前提下遍历请求数据呢?
PHP中是通过foreach语句来实现对数组的遍历。
请看下面的例子:
#iterator.php 文件
使用iterator.php?
id=juxugongzi &password=adsl&address=peking这个链接访问它,将会看到foreach语句将所有用GET方法请求的变量都枚举出来了,而在事先,我们并不知道每个请求变量的名字。
二、 $_POST数组
GET方法的本意就是下载(与其对应的是上传方法PUT),因此并不是专门用于传递数据的,它将请求数据全部经过URL编码后缀在请求资源的后面,这样一来,当数据很多时URL就会变得很长——但这并不是问题的所在,问题所在是一些WEB浏览器或服务器程序会限制这行字符串的长度。
这时,就需要用到 POST方法了。
顾名思义,POST方法的主要用途就是“传递”数据,它将数据放在所有请求标题的后面上传,这样一来,无论有多少数据上传都不成问题了(这样请求数据的大小之取决于WEB服务允许的尺寸了)。
通常来说,对于表单数据如无特别需要都使用POST方法来上传,这样就无须去关心具体上传数据的尺寸了。
POST方法的请求数据被封装到了$_POST数组中,其使用方法与$_GET数组一样。
将上面的表单添加一个method属性,就变成了这样:
#login.html文件
# post.php文件
另一个有趣的设定是,GET方法和POST方法并不矛盾,在POST方法中同样可以传递GET变量,将上面的post.php文件稍微改动一下,就成了这样:
#login.html文件
# post.php文件
该程序同时处理了GET方法(act 参数)和POST方法(id 和 password 参数)的请求数据,GET方法的请求变量后缀在了表单action属性值的后面,这样只有一点问题,就是GET方法的请求变量不能由用户来输入。
通常,固定的数据使用GET方法,由用户输入的数据使用POST方法来发送,两种方法区分开了不同逻辑的数据。
不过读者在构建这种表单的时候,一定要注意两种方法不要有相同的变量名,否则将出现不可预料的后果。
最后,需要注意的是,当使用GET方法发送数据时,则
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 第3讲 表单设计WEB交互会话控制 表单 设计 WEB 交互 会话 控制
![提示](https://static.bdocx.com/images/bang_tan.gif)