高中信息技术第8章网页表单的处理课件粤教版选修.ppt

表单是用于实现网页浏览者与服务 器之间信息交互的一种页面元素，被广 泛用于各种信息的搜集和反馈。通过本 章学习，应该掌握以下内容： 1. 认识网页表单 2. 创建表单的方法 3. 编辑表单 4. 设置表单确认页面 第8章 网页表单的处理 8.1 利用FrontPage 2002处理表单 8.1.1 创建表单 1 . 表单概述 表单是用来收集浏览者的用户名、密码、E-mail地址、个人爱 好和联系地址等用户信息的输入区域集合。 FrontPage提供了文本框、文本区、单选按钮、复选框、下拉框 、提交按钮和重置按钮等丰富的表单域。 （1）文本框：文本框用来输入比较简单的信息 。 （2）文本区：如果需要输入建议、需求等大段文字，使用文本框就 显得力不从心了，这时通常使用带有滚动条的文本区。 （3）单选按钮：单选按钮常用于表示唯一的选择结果。 （4）复选框：复选框常用来表示许多项可以同时选中的事物，比如 个人爱好、所学科目和选购的产品种类等。 （5）下拉列表框：当需要选择职业、文化程度等事项时，除了文本 区以外，还可以考虑使用下拉列表框。 （6）提交按钮和重置按钮：当用户完成了表单的填写后，如果需要 提交数据，则可以单击表单中的提交按钮。如果希望恢复表单为 填写前的状态，以便重新填写，则可以单击重置按钮。 2创建表单 在FrontPage 2002中可以通过应用向导创建表单，也可以 自己手动创建表单。 8.1.2 编辑表单 1修改表单 （1）删除不必要的域 如果是手动创建的表单，删除不必要的域的方法很简单，只需 将选中需要删除的域，单击Delete键即可。如果是用表单向导创 建的表单，将鼠标指针移至要删除的行的左侧，当鼠标变成指向 箭头时，选择要删除的域，然后单击鼠标右键，从弹出的快捷 菜单中选择“删除单元格”命令即可。 （2）修改文本框的宽度 在FrontPage 2002中修改文本框的宽度有以下两种方法： 鼠标拖动法 用鼠标选中要修改文本框，选中状态下的文本框被6个小方框包 围起来，拖动其中的小方框就可以改变文本框的宽度。 精确设置法 用鼠标选中要修改文本框，然后单击右键，从弹出的快捷菜单 中选择“表单域属性”命令，弹出“文本框属性”对话框，在“宽度” 文本框中输入精确数值，然后单击“确定”按钮。 （3）修改域标题 在表单中修改域标题也很容易，只要用鼠标选中要更改的域标 题，然后直接输入所需的域标题即可。 2设置表单的背景颜色 3设置光标顺序 在填写表单时，使用键盘上的“Tab”键，就可以在各项之间进 行切换。 “Tab”键顺序是在各属性对话框中设置的。 4设置密码域属性 在填写表单时，填写的某些内容会以“*”表示，这是为了防止 输入的某些重要内容被其他人偷看。要想为标单加上此功能，只 要在“文本框属性”对话框里的“密码域”选项组中选择“是”按钮即 可。 8.1.3保存表单结果 访问者填写完表单内容后发送出去，发送后的表单结果要存放 在某一位置。表单结果存放的位置是由表单属性指定的 。 8.1.4设置表单确认页面 在测试表单时，单击“注册”按钮后，浏览器会自动调出一个确 认表单页面，其提示信息均为英文。表单的确认页面也可以自己 设置，在浏览时让浏览器将自设的确认页面调出。 1制作确认表单 2链接确认表单与表单页面 8.2 处理网页表单的其他方法 8.2.1 利用HTML处理表单 利用HTML也可以创建表单，这样创建的表单通常由两类元素构 成，一是普通的页面元素，例如表格、图像、文字等，二是用于接 收信息的特定页面元素，也就是所谓的表单控件。 1表单标记符 HTML中表单标记符为FORM，其主要作用是设定表单的起止位 置，并指定处理表单数据程序的URL地址。 2表单输入标记符 INPUT是表单输入标记符，在表单创建中使用频繁，大部分表单 内容需要用到此标记符。 3控件定义方法 （1）文本框和口令框 创建单行文本框的基本语法如下： （2）复选框与单选按钮 创建复选框和单选框也是使用INPUT标记符，语法分别如下： （3）按钮 创建提交按钮、重置按钮和自定义按钮的语法分别如下： （4）多行文本框（文本区） 利用HTML创建多行文本框应使用TEXTAREA标记符，其使用 格式如下： 默认多行文本 （5）选项菜单 要创建选项菜单应使用SELECT标记符，并将每个可独立选 取的项用一个OPTION标记符标出来。 8.2.2 利用Dreamweaver 4.0处理表单 Dreamweaver 4.0提供了大量的表单元素。将“Object”面板 切换到“Forms”类下，即可看到各种表单元素 。 1插入文本框 （1）创建空白表单 （2）插入文本框 插入单行文本框 插入多行文本框 插入密码文本框 2设置文本框属性 3插入单选按钮 （1）插入单选按钮 （2）设置单选按钮的属性 4插入复选框 （1）插入复选框