网页设计与制作项目式教程 教学课件 作者 凌云项目六 项目六 利用表单获取用户反馈.pptVIP

项目六 利用表单获取用户反馈  任务一 设计表单 【知识目标】 1．了解表单的概念。 2．熟悉表单对象的属性设置。 3．掌握表单和表单对象的创建方法。 任务一 设计表单 【技能目标】 1．能灵活使用表单对象进行不同表单的设计。 2．能综合使用网页对象进行表单设计。 任务一 设计表单 【项目描述】 在网页制作中，表单为浏览用户与服务器之间架起“沟通”的桥梁，用户与服务器的之间的交流是交互的。一方面通过表单，可以获取用户的反馈信息；另一方面，服务器接收到这些信息后，调用脚本或应用程序对这些信息进行处理，并反馈给用户。用户可以使用文本域、密码域、复选框等表单对象输入个人信息，通过提交按钮实现信息的发送。Dreamweaver是以整个表单为单位进行信息的发送，所以在插入表单对象前，要先在网页中插入空白的表单，然后在其内部插入表单对象，保证信息的整体发送。 6.1 设计表单 6.1.1 项目准备 1．表单 　　表单对象是在表单的基础上存在的，因此要添加表单对象，首先应该创建表单。 　　常用的创建表单的方法有以下两种： （1）选择菜单【插入记录】/【表单】/【表单】，将在文档中插入一个表单，如图6-2所示。 （2）单击插入面板【表单】类别中的表单按钮 。 　 图6-2 插入的空白表单 说明：因为表单是不可见元素，所以在创建表单域之前应选择【查看】/【可视化助理】/【不可见元素】命令，显示不可见元素。如果仍不能显示表单的红色边框，可以选择【编辑】/【首选参数】，在【首选参数】对话框的【不可见元素】分类中，复选【表单范围】。　　单击表单，在属性检查器显示如图6-3所示的表单属性。　　 图6-3 表单属性检查器 …….  表单属性的参数含义如下： 表单名称：用于输入表单的名称，在同一文档中表单名称必须惟一。 动作：用于设置路径或单击文件夹图标导航到相应的页面或脚本，以指定将处理表单数据的页面或脚本。 方法：用于选择需要设置表单数据发送的方法，包含以下3个选项： 【默认】通常为GET方法；GET用于将表单数据附加到请求该页面的 URL 中。但是不要使用 GET 方法发送长表单。因为URL 的长度限制在 8192 个字符以内，如果发送的数据量太大，数据将会被截断，从而会导致意外的或失败的处理结果。 【POST】用于在 HTTP 请求中嵌入表单数据。 表单属性的参数含义如下： 目标：用于指定一个窗口来显示被调用程序返回的数据。 包含4个选项：有_blank、_parent、_top和_self。 MIME类型：用于指定对提交给服务器进行处理的数据使用MIME编码类型，包含以下2个选项：选择application/x-www-form-urlencoded选择，通常与POST协同使用；选择multipart/form-data选项，通常用于创建文件上传域。 类：用于指定可在表单中使用的CSS模式。  2．文本域 在网页中，常见的文本域有以下3种类型： （1）单行文本域：用于输入单行信息。通常可以输入单字或短语，如姓名或地址。 （2）多行文本域：用于输入多行信息。可以设置输入文本的宽度和行数。 （3）密码域：用于输入密码信息。当用户输入密码时，所输入的文本被替换为星号或项目符号，以隐藏该文本，保护密码信息。 　　在这3种文本域中输入文本的显示方式如6-4所示。  常用的插入文本域的方法有以下两种： （1）选择菜单【插入记录】/【表单】/【文本字段】，弹出如图6-5所示的【输入标签辅助功能属性】对话框。 （2）单击插入面板【表单】类别中的【文本字段】按钮 。  图6-5 【输入标签辅助功能属性】对话框  【输入标签辅助功能属性】对话框各参数含义如下： ? ID：为表单域指定 ID。这个值可用于从 JavaScript 中引用域 ? 标签文字：用于输入表单对象的名称。如labelinput type=text name=xm姓名：/label ? 使用“for”属性附加标签标签：使用 for 属性在表单项两侧添加 Label 标签。如input type=radio name=radiobutton value=radiobutton id=radiobuttonlabel for=radiobuttonRadioButton/label  ? 无标签标记：不使用 Label 标签。如input type=text name=xb value=男男 ? 位置：用于为标签选择相对于表单对象的位置，包括在表单项前和在表单项后两个选项。 ? 访问键：用于使用等效的键盘键以在