第6章表单与交互式网页 HTML表单 JSP借由标签所构成的表单区块中,取得用户在其中特 定字段输入的数据內容。 服务器端 Tomcat网站 表单1□ 送出JSP网页 HIML表单2 表单2 AP翟∮代码 xxx. sp 用户在HIML 文件内容 表单中输入信息 表单1[xx 返回表单信息 JSP程序代码处用 表单2[yY 户输入的表单信息 JSP运算 发达的 结果展示 JSP动态网页新技术
第6章 表单与交互式网页 JSP 动态网页新技术 1 HTML表单 JSP借由标签所构成的表单区块中，取得用户在其中特 定字段输入的数据內容。 HTML 表单 1 HTML 表单 2 文件內容 xxx.jsp xxx.jsp 客户端浏览器 服务器端Tomcat网站 送出 JSP网页 用户在HTML 表单中输入信息 yyy.jsp xxxx yyyy 返回表单信息 JSP程序代码处用 户输入的表单信息 发送包含运 算結果的 JSP 网页 JSP运算 结果展示 表单 1 表单 2 表单 1 表单 2
第6章表单与交互式网页 HTML表单属性 HTML定义了可用以放置在表单区域內的属性与功能选项标签 文件吧)编辑)查着①)收工具辽)帮助 ⊙·0图搜收来的,回,回￠ 地址)·自H∥1x01801Mk制人中文,直特到链” 个人信息 姓名 性别 O我是男生O我是女生 通信地址 完毕 ● Internet JSP动态网页新技术 2
第6章 表单与交互式网页 JSP 动态网页新技术 2 HTML表单属性 HTML定义了可用以放置在表单区域內的属性与功能选项标签
第6章表单与交互式网页 HTML表单属性标签 功能 标签 说明 文本框 提供输入单行文字、数字等数据的文本框 选项按钮 提供类似收音机按钮的单一选项按钮 复选框 提供外观包含一个四边形方块,可供勾选特定项 目的复选框 文本区域 提供大量、多行的文字、数字等类型的数据输入 文本区域。 下拉列表框 提供具备清单选项的下拉式文本列表 提供具备清单选项的多行选项文本列表。 传送按钮 提供将网页数据内容传送回服务器的按钮。 重设按钮 nput type="reset 提供重设网页数据内容的重设按钮。 JSP动态网页新技术 3
第6章 表单与交互式网页 JSP 动态网页新技术 3 HTML表单属性标签 功 能 标 签 说 明 文本框 提供输入单行文字、数字等数据的文本框。 选项按钮 提供类似收音机按钮的单一选项按钮。 复选框 提供外观包含一个四边形方块，可供勾选特定项 目的复选框。 文本区域 提供大量、多行的文字、数字等类型的数据输入 文本区域。 下拉列表框 … 提供具备清单选项的下拉式文本列表。 组合式列表 … 提供具备清单选项的多行选项文本列表。 传送按钮 提供将网页数据内容传送回服务器的按钮。 重设按钮 提供重设网页数据内容的重设按钮
第6章表单与交互式网页 文本框 文本框是用来取得用户在网页所输入的姓名、地址之类等相关数据内 容 <input type= text name="txtName" size=20 文本框外观 密码输入属性主要用在取得用户输入的密码,且会出现密码符号代替用 户所输入的数据以避免密码被其它人看见。 ●@@ JSP动态网页新技术
第6章 表单与交互式网页 JSP 动态网页新技术 4 文本框 ➢ 文本框是用来取得用户在网页所输入的姓名、地址之类等相关数据内 容 。 ➢ 文本框外观 ➢ 密码输入属性主要用在取得用户输入的密码，且会出现密码符号代替用 户所输入的数据以避免密码被其它人看见
第6章表单与交互式网页 文本框属性 属性 说明 type text/ password。 name 指定文字输入栏的名称。如name=" username",则在JSP程序 中可利用此名称来取得其中所输入的数据。 value 设定文字属性的默认值。 SIze 设定文字属性的长度。 maxlength设定文字属性可接受的字符上限,中文字也算一个字符。 JSP动态网页新技术 5
第6章 表单与交互式网页 JSP 动态网页新技术 5 文本框属性 属 性 说 明 type text / password。 name 指定文字输入栏的名称。如name="usrname"，则在JSP程序 中可利用此名称来取得其中所输入的数据。 value 设定文字属性的默认值。 size 设定文字属性的长度。 maxlength 设定文字属性可接受的字符上限，中文字也算一个字符
第6章表单与交互式网页 多行文本输入区域 多行文本输入区域常用于输入大量的文字数据 HTM定义了一些可以放置在表单区域内的属 性与功能选项卷标,其中还包含了传送数据 的指令按钮卷标。 JSP动态网页新技术 6
第6章 表单与交互式网页 JSP 动态网页新技术 6 多行文本输入区域 多行文本输入区域常用于输入大量的文字数据
第6章表单与交互式网页 属性 属性 说明 name设定文本区域的名称 rows设定文本区域显示的列数 cos设定文本区域显示的行数 value设定文本区域的默认值 JSP动态网页新技术 7
第6章 表单与交互式网页 JSP 动态网页新技术 7 属性 属 性 说 明 name 设定文本区域的名称 rows 设定文本区域显示的列数 cols 设定文本区域显示的行数 value 设定文本区域的默认值
第6章表单与交互式网页 单选按钮 单选按钮使用于多选一的情况,标签的ψype属性设定为 radio <input type=radio 具有相同name属性的单选钮,被归纳为同一个选项群组, 因此只能选择其中某一个选项,若name属性不同则为各自 独立的选择群组, ≯一个以上的单选按钮組合,提供用户在网页上选择所需的特定选 项 性别:男」⊙女 JSP动态网页新技术 8
第6章 表单与交互式网页 JSP 动态网页新技术 8 单选按钮 ➢ 单选按钮使用于多选一的情况，标签的type属性设定为 radio： • • 具有相同name属性的单选钮，被归纳为同一个选项群组， 因此只能选择其中某一个选项，若name属性不同则为各自 独立的选择群组， ➢ 一个以上的单选按钮組合，提供用户在网页上选择所需的特定选 项
第6章表单与交互式网页 单选按钮属性 属性 说明 name 设定该单选钮的名称 value 设定单选钮返回给JSP程序的值 checked设定单选钮是否为预设选取 JSP动态网页新技术
第6章 表单与交互式网页 JSP 动态网页新技术 9 单选按钮属性 属 性 说 明 name 设定该单选钮的名称 value 设定单选钮返回给JSP程序的值 checked 设定单选钮是否为预设选取
第6章表单与交互式网页 复选框 复选框用来复选多个选项,其 INPUT标签的type属性设为 checkbox。 Input type= checkbox> ≯复选框通常代表一种布尔类型的数据,若是符合其提示说明则选择 一组复选框并不会特别限定只允许选择其中一个选项 唱歌回 跳舞口 游泳口 上网口 爬山回 逛街口 JSP动态网页新技术
第6章 表单与交互式网页 JSP 动态网页新技术 10 复选框 ➢复选框用来复选多个选项 ，其INPUT标签的type属性设为checkbox。 ➢复选框通常代表一种布尔类型的数据，若是符合其提示说明则选择 。 ➢一组复选框并不会特别限定只允许选择其中一个选项