第 6章 表单与交互式网页
JSP 动态网页新技术 1
HTML表单
JSP借由标签 <FORM>所 构成 的 表单区块 中,取得 用户在 其中特定 字段输入 的 数据 內容 。
< H T M L >
H T M L 表 单 1
H T M L 表 单 2
< %
,,,
J S P 程 序 代 码
,,,
% >
文 件 內 容
< / H T M L >
x x x,j s p
x x x,j s p
客 户 端 浏 览 器服 务 器 端 T o m c a t 网 站送 出 J S P 网 页用 户 在 H T M L
表 单 中 输 入 信 息
y y y,j s p
x x x x
y y y y
返 回 表 单 信 息
J S P 程 序 代 码 处 用户 输 入 的 表 单 信 息发 送 包 含 运算 結 果 的
J S P 网 页
J S P 运 算结 果 展 示表 单 1
表 单 2
表 单 1
表 单 2
第 6章 表单与交互式网页
JSP 动态网页新技术 2
HTML表单属性
HTML定义 了可用以 放置在表单区域 內的 属性与 功能 选项标签 。
第 6章 表单与交互式网页
JSP 动态网页新技术 3
HTML表单属性标签功 能 标 签 说 明文本框 <input type="text"> 提供输入单行文字、数字等数据的文本框。
选项按钮 <input type="radio"> 提供类似收音机按钮的单一选项按钮。
复选框 <input type=checkbox> 提供外观包含一个四边形方块,可供勾选特定项目的复选框。
文本区域 <textarea></textarea> 提供大量、多行的文字、数字等类型的数据输入文本区域。
下拉列表框 < select size=1>
< option >…
</ select >
提供具备清单选项的下拉式文本列表。
组合式列表 <select size =sizeNumer>
<option>

</select>
提供具备清单选项的多行选项文本列表。
传送按钮 <input type="submit"> 提供将网页数据内容传送回服务器的按钮。
重设按钮 <input type="reset"> 提供重设网页数据内容的重设按钮。
第 6章 表单与交互式网页
JSP 动态网页新技术 4
文本框
文本框是用来取得用户在网页所输入的姓名、地址之类等相关数据内容 。
<input type="text"
name="txtName" size="20">
文本框外观
密码输入属性主要用在取得用户输入的密码,且会出现密码符号代替用户所输入的数据以避免密码被其它人看见。
第 6章 表单与交互式网页
JSP 动态网页新技术 5
文本框属性属 性 说 明
type text / password。
name 指定文字输入栏的名称。如 name="usrname",则在 JSP程序中可利用此名称来取得其中所输入的数据。
value 设定文字属性的默认值。
size 设定文字属性的长度。
maxlength 设定文字属性可接受的字符上限,中文字也算一个字符。
第 6章 表单与交互式网页
JSP 动态网页新技术 6
多行文本输入区域多行文本输入区域常用于输入大量的文字数据
<textarea rows="2"
name="txtareaName" cols="20"></textarea>
第 6章 表单与交互式网页
JSP 动态网页新技术 7
<textarea>属性属 性 说 明
name 设定文本区域的名称
rows 设定 文本区域 显示的列数
cols 设定 文本区域 显示的行数
value 设定 文本区域 的默认值第 6章 表单与交互式网页
JSP 动态网页新技术 8
单选按钮
单选按钮 使用 于多选 一的 情况,<input>标签的 type属性设定为
radio:
<input type="radio">
具有相同 name属性的单选钮,被归纳为同一个选项群组,
因此只能选择其中某一个选项,若 name属性不同则为各自独立的选择群组,
一 个 以上的 单选按钮 組合,提供用户在网页 上 选择 所需的特定 选项 。
第 6章 表单与交互式网页
JSP 动态网页新技术 9
单选按钮属性属 性 说 明
name 设定该单选钮的名称
value 设定单选钮返回给 JSP程序的值
checked 设定单选钮是否为预设选取第 6章 表单与交互式网页
JSP 动态网页新技术 10
复选框
复选框用来复选多个选项,其 INPUT标签的 type属性设为 checkbox。
<input type="checkbox">
复选框通常代表一种布尔类型的数据,若是符合其提示说明则选择 。
一组复选框并不会特别限定只允许选择其中一个选项 。
第 6章 表单与交互式网页
JSP 动态网页新技术 11
复选框属性属 性 说 明
name 设定复选框的名称
value 设定复选框返回给 JSP程序的值
checked 设定复选框是否为预设选取,若值为 true则表示默认选取第 6章 表单与交互式网页
JSP 动态网页新技术 12
下拉列表框下拉列表框的主体由 <select>,</select>标签所组成,而其内容选项则是使用 <option>标签来设定 。
<select>
<option>选项 1
<option>选项 2
</select>
第 6章 表单与交互式网页
JSP 动态网页新技术 13
下拉列表框属性
<select>
<option >
属 性 说 明
name 设定下拉列表框的名称
size 设定下拉列表框显示的项目个数
multiple 设定下拉列表框内的数据是否能够复选属 性 说 明
value 设定数据选项所返回给 JSP的值
selected 设定数据选项为默认选取。
第 6章 表单与交互式网页
JSP 动态网页新技术 14
发送按钮与重设按钮
发送按钮,当用户单击按钮后 可 将数据传送 給 程序处理 。
<input type=“submit” value=“发送数据,>
重设按钮,将输入与选择 的 数据 清除。
<input type=“reset” value=“重设数据” >
属性 value用 来设定按钮 上的 显示 文字。
第 6章 表单与交互式网页
JSP 动态网页新技术 15
改良的 Hello World范例第 6章 表单与交互式网页
JSP 动态网页新技术 16
表单与交互式网页结构送 出 网 页 至 浏 览 器用 户 输 入 数 据返 回 给 服 务 器接 收 数 据 导 向指 定 网 页送 出 结 果 网 页至 浏 览 器浏 览 器 端处 理 数 据 的指 定 网 页
H ello.jsp
显 示 处 理结 果
H ello.htm
表 单提 示 表 单提 交 按 钮服 务 器第 6章 表单与交互式网页
JSP 动态网页新技术 17
表单
< form ></ form >标签在网页创建一块 特定 区域作为一种标签 容器,形成收集 用户数据 功能的 网页表单 。
属性 method,action和 name,配合 < form >标签,形成 创建表单 的 完整语法 。
<form method="POST/GET"
action="responsePath" name="formName" >
表单内容 …
</form>
其中 method指定网页以何种模式传送表单的属性数据,可能的两种模式分别是
Post和 Get 。
action代表这一份表单网页传送出去之后,服务器对其响应所返回的网页路径地址,若是这个属性没有设定,网页本身会被当作 action属性值 。
name代表 表单的名称,JSP利用这个名称,辨识网页中的特定表单区域 。
第 6章 表单与交互式网页
JSP 动态网页新技术 18
Request对象
request对象为网页服务器端程序中,用以取得客户端表单属性内容数据的主要核心对象 。
request对象让网页服务器运作的过程,得以和客户端的用户相互作沟通 。
第 6章 表单与交互式网页
JSP 动态网页新技术 19
Request对象方法成员分 类 方 法 说 明取得用户参数
GetParameter(strName) 返回指定变量名称的数据。
GetParameterValues(strName) 返回所有变量名称的集合,集合中的内容为各个传送的变量名称。
GetParameterNames() 返回指定名称的数组,若用户所输入的数据为复数,且变量名称相同,则使用此方法来取得复数的数组数据。
取得系统信息
getProtocol() 返回通信协议的方式
getRemoteAddr() 返回客户端用户的 IP地址
getRemoteHost() 返回客户端用户的主机名称
getRemoteHost() 返回发出请求的方式,如 http,ftp,telnet
getScheme() 返回发出请求的方式,如 http,ftp,telnet
getServerName() 返回服务器主机的名称
getServerPort() 返回服务器主机的连接端口号码,如,8080
getRealPath("") 返回目前虚拟路径的真实路径
getMethod() 返回传送数据的方式,如,GET,POST
getQueryString() 返回附在网址列后的字符串数据
getRequestURI() 返回请求的 URI字符串,不包含网址列后的查询字符串,如
“http://myCom/jsp?data=hello world!”会传回,/myCom/jsp”
getServletPath() 传回程序的相对路径与文件名取得标头信息
getHeader(String name) 返回名称为 name的请求标头内容
getHeaderNames() 返回所有请求标头名称的集合第 6章 表单与交互式网页
JSP 动态网页新技术 20
获取表单数据
GetParameter()是获取表单数据最简单的方法,
request.GetParameter(strName)
参数 strName,代表所要 获取 的 表单属性名称 。
第 6章 表单与交互式网页
JSP 动态网页新技术 21
设定中文编码方法 setCharacterEncoding()用來 设定 request对象的编码格式,
此方法接受 一个代表编码格式的标识符串,简体中文的编码为
GB2312,
<%request.setCharacterEncoding(“GB2312") ; %>
第 6章 表单与交互式网页
JSP 动态网页新技术 22
Post 与 Get区别
<Form>的 Method属性,有 两种 可能值,Post和 Get。
Post将 所要 发送 的 数据 包含在 HTTP标头,Get将数据 直接串接在网址列 的 后面 。
使用 GetParameter 获取传送 的 数据 內容 。
第 6章 表单与交互式网页
JSP 动态网页新技术 23
getParameterNames()
getParameterNames()方法主要是用来取得所有传递变量的名称,
其返回值是一个包含所有变量名称的 Enumeration集合对象 。
参 数 名 称 1
参 数 名 称 2
参 数 名 称 N

E n u m e r a t i o n 集 合 对 象第 6章 表单与交互式网页
JSP 动态网页新技术 24
Enumeration接口类型
Enumeration是 java.util包 中的一 个接口 。
Enumeration objName;
Enumeration可使用的方法:
hasMoreElement()
– 传回布尔值表示对象中是否还包含元素。
nextElement()
– 传回集合中的下一个元素,元素的数据类型为 Object。
第 6章 表单与交互式网页
JSP 动态网页新技术 25
nextElement() 方法
n a m e
t e l
e m a l
v a r o b j 集 合 对 象指 针
n a m e
t e l
e m a l
v a r o b j 集 合 对 象指 针第 6章 表单与交互式网页
JSP 动态网页新技术 26
获取标头信息
HTTP通信协议是使用在规范界定网页服务器和浏览器之间,
进行沟通与数据交换所需的规则,HTTP整个运行的过程可分为以下三个步骤 。
请求
标头数据交换
主题数据传输第 6章 表单与交互式网页
JSP 动态网页新技术 27
获取标头信息 -请求浏 览 器服 务 器请 求第 6章 表单与交互式网页
JSP 动态网页新技术 28
获取标头信息 -标头数据交换浏 览 器服 务 器请 求 标 头响 应 标 头第 6章 表单与交互式网页
JSP 动态网页新技术 29
获取标头信息 -主体数据传输服 务 器下 载 资 料网 页 资 料浏 览 器 端第 6章 表单与交互式网页
JSP 动态网页新技术 30
Request对象 方法 成员方 法 说 明
getHeader(String name) 返回名称为 name的请求标头内容
getHeaderNames() 返回所有请求标头名称的集合第 6章 表单与交互式网页
JSP 动态网页新技术 31
response 对象 方法 成员分 类 方 法 说 明设定响应信息 getCharacterEncoding 返回文件内容编码的方式
setContentType 设定网页的文件格式与编码方式
sendError 自定义输出客户端的错误代码以及信息。
setStatus 用来设定一个响应的 HTTP状态码第 6章 表单与交互式网页
JSP 动态网页新技术 32
response 对象 方法 成员分 类 方 法 说 明响应标头信息 ContainsHeader
(String name)
返回布尔值表示名称为 name的标头是否存在
SetDateHeader
(String name,long date)
设定名称为 name的响应标头,数据类型为长整数 long,内容为 date,其值为格林威治时间自 1970年 1月 1日开始算起到要设定时间的毫秒数
setHeader(String name,
String value)
设定名称为 name的响应标头其内容为 value,数据类型为字符串 String
setIntHeader(String
name,int value)
设定名称为 name的响应标头其内容为 value,数据类型为整数 int
第 6章 表单与交互式网页
JSP 动态网页新技术 33
response 对象 方法 成员分 类 方 法 说 明缓冲区处理 flushBuffer() 清空缓冲区
getBufferSize() 取得缓冲区大小
setBufferSize() 设定缓冲区大小
isCommitted() 表示数据是否出写入浏览器
reset() 清除缓冲区内容网页定向与重定向
sendRedirect("pageUrl
")
重新定向网页至指定的 url
第 6章 表单与交互式网页
JSP 动态网页新技术 34
设定响应信息
getCharacterEncoding方法,返回文件内容编码的方式 。
response.getCharacterEncoding()
默认情况下返回的值是 8859_1。
setContentType方法,用来设定网页的文件格式与编码方式,与
page指令的 contentType属性功能是相同的 。
response.setContentType
("text/html;charset=GB2312");
第 6章 表单与交互式网页
JSP 动态网页新技术 35
设定响应信息
sendError方法,自定义一个错误的代码,以及错误的信息输出至客户端 。
response.sendError(错误代码,文字信息 )
setStatus方法
– 设定一个响应的 HTTP状态码,依这个状态码,客户端便会出现相关的信息 。
– 打开的网页正确无误,则会自动传送一个 SC_OK(整数值为 200)
的状态码。
第 6章 表单与交互式网页
JSP 动态网页新技术 36
响应标头信息
<%
//设定 Connection 标头 的內容
response.setHeader(“Connection”,“keep-alive”);
//设定 Expires 标头 的內容
response.setDateHeader(“Expires”,10000*10000);
//设定 Retry-After 标头 的內容
response.setIntHeader(“Retry-After”,1000);
//查看响应标头 中是否包含 Expires
response.containsHeader("Expires");
%>
第 6章 表单与交互式网页
JSP 动态网页新技术 37
操作 缓冲区
Response提供用以 处理缓冲区的 功能:
flushBuffer,清空缓冲区
getBufferSize,获取缓冲区大小
setBufferSize,设定缓冲区大小第 6章 表单与交互式网页
JSP 动态网页新技术 38
重新定向网页
Response对象 的 sendRedirect方法用 来 重新 定向 新 网页,
response.sendRedirect(,定向网页 的 相对地址 或 绝对地 址,)
第 6章 表单与交互式网页
JSP 动态网页新技术 39
Cookie
Cookie数据储存的功能由浏览器本身所提供,因此 Cookie功能都必须要有浏览器的支持才行 。
当用户打开的网页中包含 Cookie程序代码,此时服务器端会建立
Cookie数据,然后将这个 Cookie传送到客户端用户的计算机上 。
第 6章 表单与交互式网页
JSP 动态网页新技术 40
Cookie示意图储 存 C o o k i e
服 务 器浏 览 器响 应 返 回
C o o k i e
请 求 客 户 端
C o o k i e
第 6章 表单与交互式网页
JSP 动态网页新技术 41
建立 与传送 Cookie
建立 Cookie的 语法,
Cookie objCookie = new Cookie(indexValue,stringValue)
一个 Cookie对象必须包含有一个特定的 indexValue索引值与字符串类型的数据内容 stringValue。
传送 到客 户 端:
response.addCookie(objCookie)
第 6章 表单与交互式网页
JSP 动态网页新技术 42
获取 Cookie 步骤
取得 客户端包含所有 Cookie对象的数组,
request.getCookies()
利用循环取出数组中的各个 Cookie,并比对索引值来取出所要的
Cookie对象 。
取出所要的 Cookie后便可以取得该 Cookie中的数据内容,
Cookie名称,getName() //返回 指定 Cookie的索引值
Cookie名称,getValue() //返回 指定 Cookie的 数据第 6章 表单与交互式网页
JSP 动态网页新技术 43
设定 Cookie的存在期限在默认情况下,Cookie是随着用户关闭浏览器而自动消失,
不过 Cookie也可以设定其存在的期限,让用户下次开启网页时,
服务器端仍然能够取得同样一个 Cookie中的数据内容。
方 法 说 明
setMaxAge(int
second)
设定 Cookie在 second秒的时间内皆为有效
getMaxAge() 返回 Cookie的有效期限第 6章 表单与交互式网页
JSP 动态网页新技术 44
删除 Cookie
要删除某一个客户端的 Cookie,必须使用前面的 sexMaxAge()
方法,并将 Cookie的存在期限设为 0 。
Cookie名称,setMaxAge(0)
第 6章 表单与交互式网页
JSP 动态网页新技术 45
Cookie的 有效路径
Cookie对象产生后,所有 服务器端的网页均 能存取其 数据 內容。
存取该 Cookie对象的网页路径范围,
方 法 说 明
setPath(String uri) 设定能够存取 Cookie对象的网页路径为 uri与其下的子目录
getPath() 返回能够存取 Cookie对象的网页路径