07第7章制作表单网页..docVIP

07第7章制作表单网页. 07第7章制作表单网页. PAGE / NUMPAGES 07第7章制作表单网页. 第 7 章 制作表单网页 平时，一个表单中包括多个对象，有时也称为控件或表单元素，比方用于输入文本的文本域、用于发丧命令的按钮、用于选择项目的单项选择按钮和复选框、用于显示列表项的列表框等。 【授课导航】 1）学会制作表单网页 2）在网页中正确插入表单域 3）在表单域中正确插入文本域和文当地域 4）在表单域中正确插入单项选择按钮、单项选择按钮组和复选框 5）在表单域中正确插入列表 /菜单、跳转菜单、按钮和图像域 授课目的（ 6）掌握检查提交表单数据的正确性的方法 7）预设输入文字的字体和大小 8）引用外面 JavaScript 脚本文件在网页中显示当前日期 9）引用外面 JavaScript 脚本文件动向改变网页中的菜单项选择项 10 ）引用外面 JavaScript 脚本文件考据表单数据 11）认识使用 Spry 考据控件实现对表单控件内容的检测 1）在网页中正确插入表单域，在表单域中正确插入各种表单元素 本章要点（ 2）检查提交表单数据的正确性 3）引用外面 JavaScript 脚本文件实现表单网页所需的功能 1）在表单域中插入列表 /菜单和跳转菜单 本章难点 2）使用 Spry 考据功能实现对表单元素的内容检测 授课方法任务驱动法、分组谈论法、四步训练法 课时建议6 课时（含课堂同步训练） 7.1 课前准备 新建一个站点 1）在当地硬盘创办文件夹 2）启动 Dreamweaver CS3 3）创办名称为“ E 游检查”的当地站点 新建一个网页文档 index0701.html 第 7 章 制作表单网页 1）新建一个网页文档 2）设置网页标题 3）保存该网页。 在网页中插入表格 1、在网页 index0701.html 中插入表格 1 2、在网页 index0701.html 中插入表格 2 3、在网页 index0701.html 中插入表格 3 4、在表格 3 中插入表格 3-1 （ 1）插入 4 行 1 列表格 3-1 （ 2）在表格 3-1 第 1 行的单元格中插入表格 3-1-1 （ 3）在表格 3-1 第 3 行的单元格中插入表格 3-1-3 （ 4）在表格 3 第 2 行的单元格中插入表格 3-1-2 （ 5）在表格 3 第 4 行的单元格中插入表格 3-1-4 7.2 课堂引导训练及谈论 【课堂引导训练任务描述】 1、网页制作任务卡 网页制作任务卡如表 7-5 所示。 表 7-5 网页制作任务卡 任务编号 07-1 任务名称 制作表单网页 网页主题 E 游检查 计划工时 120min （ 1）制作一个表格布局的网页 （ 2）在网页插入表单域，且设置该表单域的属性 （ 3）在表单域中分别插入单行文本域、文当地域、单项选择按钮、单项选择按钮 组、复选框、下拉式菜单、列表、跳转菜单、表单按钮和图像域 网页制作任务描述 （ 4）预设文本域中输入文字的字体和大小，阅读网页时将鼠标移到该文 本域时，实现自动选中提示信息，直接输入所需文本 （ 5）使用 Spry 考据表单数据的有效性 （ 6）在表单网页中应用行为实现检查表单和关闭阅读器窗口的功能 （ 7）引用外面 JavaScript 脚本文件实现表单网页所需的功能 网页布局结构解析 （ 1）表格布局结构，如图 7-所示。 （ 2）无导航栏 网页色彩搭配解析 网页中文字的颜色： #000000、#0000FF，背景颜色： #99CCCC、#99CCFF、 # 9BBB38 网页组成元素解析 主要包括表格、表单域、表单控件、文本、图像等网页元素 任务实现流程解析 制作表格布局的网页→插入表单域→插入表单控件→使用 Spry 考据表单 177 Dreamweaver CS3 网页制作案例教程 数据的有效性→在表单网页中应用行为实现检查表单和关闭阅读器窗口 的功能→引用外面 JavaScript 脚本文件实现表单网页所需的功能 原始文件地址： start\07 第 7 章制作表单网页 \task07-1 配盘素材导引 最后文件地址： result\07 第 7 章制作表单网页 \task07-1 2、网页制作任务追踪卡 网页制作任务追踪卡如表 7-6 所示。 表 7-6 网页制作任务追踪卡 任务编号 开始时间 完成时间 计划工时 实质工时 当前状态 【网页收效显现】 网页“ index0701.html ”的预览收效如图 7-2 所示。 图 7-2 网页“ index0701.html ”的预览收效 【任务完成过程】 插入表单域 178 第 7 章 制作表单网页 【操作要求】 在表格 3 的单元格中插入一个表单域。 【推行过