《信息技术》教案-网页表单

1、备课时间：2004/03/22课 题：第五章 网页制作 第六节 网页表单教学目的：表单的建立 表单资料的收集和处理 搜索表单的建立教学重点：表单资料的收集和处理 搜索表单的建立教学方法: 边讲解边演示教学过程：引言：直接进行操作演示教授新课：网页表单板书 第六节 网页表单一、表单的建立在FrontPage 2000中，单击 “插入（I）” 菜单中的“表单（M）”命令，其下拉菜单中列出了所有的字段，单击其中的一种，即可插入相应的字段。例5-6-1 建立如图5-25所示的表单网页，取名为guestbook.htm。图5-25操作步骤：（1）单击“新建”按钮，建立新页面，首先创建一个2×1

2、表格，并在表格的第一行插入标题动画（look.gif、liuyan.gif）。（2）右击表格的第二行，在弹出的快捷菜单中单击“拆分单元格”，打开“拆分单元格”对话框，选择“拆分为列”，并输入列数：3，将该单元格拆分分三列，分别定义两侧单元格的背景色为浅紫色。（3）将插入点移到中间的单元格后，依次单击“插入（I）” 菜单中的1 / 4“表单（M）”“单行文本框（T）”命令，页面上出现一个单行文本框和两个按钮，分别是“提交”和“复位”按钮，将插入点移到文本框左侧，接着输入“姓名：”，然后将插入点移到文本框右侧。（4）输入“年龄：”，然后依次单击“插入（I）” 菜单中的“表单（M）”“单行文本框（T

3、）”命令，产生第二个单行文本框，按回车键。（5）输入“性别：”，然后依次单击“插入（I）”菜单中的“表单（M）”“单选按钮（R）”命令，输入“女”。再用同样的方法插入另一个单选按钮，并在其右侧输入“男”，然后，双击各选项按钮，分别设置它们的属性，其中“组名称”必须相同，表示这两个按钮在同一个单选按钮组，最后按回车键。（6）输入“爱好：”，然后依次单击“插入（I）”菜单中的“表单（M）”“复选框（C）”命令，输入“音乐”。用同样方法制成其余复选框。（7）输入“职业：”，依次单击“插入（I）”菜单中的“表单（M）”“下拉菜单（D）”命令。（8）双击下拉式菜单，出现如图5-26所示的“下拉菜单属性”

4、对话框。 （9）单击“添加”按钮，添加一个“学生”菜单项，重复操作，添加其余菜单后，再单击“确定”按钮，并按回车键。（10）输入“您对本网页的建议：”后，按回车键。（11）依次单击“插入（I）”菜单中的“表单（M）”“滚动文本框（S）”命令，在网页编辑区将出现一个滚动文本框，调整文本框的大小，使其大小合适。（12）保存网页，取名为guestbook.htm。二、表单资料的收集和处理 表单的作用在于帮助收集资料，对于访问者来说，填完资料后，单击“提交”按钮，就可以将信息传送到服务器上。对于网站管理员来说，更重要的是对这些资料进行处理，将它们变成所需要的资料形式，比如在上例中，当访问者填写完表单并

5、发送回来后，网站管理员应该对这些资料进行分析，对某些读者提出的问题进行个别解答，并及时改进网站。为了方便资料的整理，在制作表单时就应该有意识地将表单的结果输出到某一个HTML文件或纯文本文件中以文件的形式存放。将鼠标指针放置在表单域所在的虚线范围内右击，在弹出的快捷菜单中单击“表单属性”，打开“表单属性”对话框，如图5-27所示。在默认情况下，表单的结果会发送到当前网站中，以form_result.txt为文件名存储起来。也可以修改文件名和文件的路径，或者以电子邮件的形式发送到指定的信箱中。当然，这些信息只有管理员才能看到，为了让访问者能够看到自己和别人的留言，以便彼此交流，还可以直接将表单的

6、处理结果返回到指定的网页中。例5-6-2 设定在留言板下方显示各位访客的留言内容。操作步骤： （1）将指针指向表单虚线框内，右击，在快捷菜单中单击“表单属性”命令，打开“表单属性”对话框，在“文件名”框中输入一个文件名，指定存放留言内容的网页，如results.htm，然后单击“确定”按钮，关闭“表单属性”对话框。 （2）保存guestbook.htm网页，单击视图栏“文件夹”按钮，切换到文件夹视图状态，然后单击“查看（V）” 菜单中的“刷新（R）”命令，可以看到FrontPage自动在当前网站的_private文件夹下建立了一个名为results.htm网页。 （3）单击视图栏“网页”按钮，

7、切换到网页制作状态，将插入点移到留言板下方表单域虚线框外，然后依次单击“插入（I）” 菜单中的“组件（O）”“包含网页（I）”命令，打开“包含网页属性”对话框，如图5-28所示。在对话框中输入“要包含的网页名”，即步骤（1）所指定的文件名results.htm，然后单击“确定”按钮。（4）进入浏览器测试留言板，留言完毕，单击“提交”按钮发送信息后，单击浏览器“刷新”按钮，即可看到留言内容。三、搜索表单的建立 搜索表单的功能仅限于在本网站中进行搜索，而不像一般的搜索引擎可以在整个WWW中搜索，因此，建立搜索表单是为了让访问者在我们的网站中迅速找到他们感兴趣的主题。在FrontPage 2000中，有内置的组件，帮助我们建立搜索表单。例5-6-3 在huanbao网站的主页上，建立一个搜索表单。具体步骤： （1）双击“index.htm”，打开主页。 （2）将插入点移到友情链接上方，依次单击“插入（I）”菜单中的“组件（O）”“搜索表单（S）”命令，打开“搜索表单属性”对话框，如图5-29所示。 （3）在对话框中输入相应的内容，单击“搜索结果”标签，在“要搜索的单词列表”文本框中输入“全部”，表示要搜索网站中的所有网页。若在“显示文件日期”复选框前打勾，还可以设置日期和时间的格式。 （4）单击“确定”按钮，页面上