16
4.1 5 5 表表表表表 表表表表表 表表表表 表表表表 表表表表表表表表表 表表表表表表表表表 表表表表表表表表表 表表表表表表表表表 表表表表表表表 表表表表表 表表表表表表表表表 、、 表表表表表表表 表表表表表 表表表表表表表表表 、、 表表表表表表 表表表表表表 / / 表表 表表表表表表 表表表表表 、、 表表 表表表表表表 表表表表表 、、 表表表表表表表表表表表表表表 表表表表表表表表表表表表表表

学习目标

  • Upload
    benoit

  • View
    31

  • Download
    2

Embed Size (px)

DESCRIPTION

学习目标. 能够理解表单的含义,插入表单域制作表单 能够插入文本域、插入按钮、插入单选框和复选框 能够插入列表 / 菜单、插入文件域、插入图像域 能够在表格布局中添加表单对象. 本章内容. 4.1  案例制作:个人信息调查表 4.2 新知解析 4.3 实战演练:网络写作注册信息表. 4.1. 案例制作: 个人信息调查表. 4 .1  案例制作:个人信息调查表. 通过本案例的操作,你将学会:如何建立表单域和插入表单对象、如何设置表单对象属性、如何利用表格定位表单对象。. 4 . 2 新知解析. 4 . 2 新知解析. 1. 插入表单 - PowerPoint PPT Presentation

Citation preview

Page 1: 学习目标

4.1

5 5 表单的应用表单的应用

学习目标学习目标

能够理解表单的含义,插入表单域制作表单能够理解表单的含义,插入表单域制作表单 能够插入文本域、插入按钮、插入单选框和复选框能够插入文本域、插入按钮、插入单选框和复选框 能够插入列表能够插入列表 // 菜单、插入文件域、插入图像域菜单、插入文件域、插入图像域 能够在表格布局中添加表单对象能够在表格布局中添加表单对象

Page 2: 学习目标

4.2

5 5 表单的应用表单的应用

4.14.1  案例制作:个人信息调查表 案例制作:个人信息调查表4.2 4.2 新知解析新知解析4.3 4.3 实战演练:网络写作注册信息表实战演练:网络写作注册信息表

本章内容本章内容

Page 3: 学习目标

4.3

5 5 表单的应用表单的应用

4.1 案例制作:个人信息调查表

4.1. 4.1. 案例制作:个人信息调查表案例制作:个人信息调查表

通过本案例的操作,你将学会:如何建立表单域和插入表单对象、如何设置表单对通过本案例的操作,你将学会:如何建立表单域和插入表单对象、如何设置表单对象属性、如何利用表格定位表单对象。象属性、如何利用表格定位表单对象。

Page 4: 学习目标

4.4

5 5 表单的应用表单的应用

44..22 新知解析新知解析

1.1. 插入表单插入表单 创建表单可以通过“插入”面板或菜单两种方法实现。步骤如下:创建表单可以通过“插入”面板或菜单两种方法实现。步骤如下:

将插入点放在希望表单出现的位置将插入点放在希望表单出现的位置。。 选择“插入”→“表单”,或选择“插入””栏上的“表单”类别,然后单击“表选择“插入”→“表单”,或选择“插入””栏上的“表单”类别,然后单击“表单”图标。单”图标。 用鼠标选中表单,在属性面板上可以设置表单的各项属性用鼠标选中表单,在属性面板上可以设置表单的各项属性 。。

4.2 新知解析

Page 5: 学习目标

4.5

5 5 表单的应用表单的应用

属性面板设置项目:属性面板设置项目:

““ 表单名称”:键入标识该表单的唯一名称,命名表单后就可以使用脚本语言(如 表单名称”:键入标识该表单的唯一名称,命名表单后就可以使用脚本语言(如 JavaScript JavaScript 或 或 VBScriptVBScript )引用或控制该表单。如果不命名表单,则 )引用或控制该表单。如果不命名表单,则 Dreamweaver Dreamweaver 使用语法 使用语法 form form nn 生成一个名称,并在向页面中添加每个表单时生成一个名称,并在向页面中添加每个表单时递增 递增 nn 的值。的值。 “ “ 动作”:指定处理该表单的动态页或脚本的路径。可以在“动作”文本框中键入动作”:指定处理该表单的动态页或脚本的路径。可以在“动作”文本框中键入完整路径,也可以单击文件夹图标定位到同一站点中包含该脚本或应用程序页的相应文完整路径,也可以单击文件夹图标定位到同一站点中包含该脚本或应用程序页的相应文件夹。件夹。

4.2    新知解析

Page 6: 学习目标

4.6

5 5 表单的应用表单的应用

属性面板设置项目:属性面板设置项目:

““ 方法”:弹出菜单中,选择将表单数据传输到服务器的方法。方法”:弹出菜单中,选择将表单数据传输到服务器的方法。 POST POST 方法将在 方法将在 HTTP HTTP 请求中嵌入表单数据。请求中嵌入表单数据。 GET GET 方法将值附加到请求该页面的 方法将值附加到请求该页面的 URL URL 中。中。 默认方法使用浏览器的默认设置将表单数据发送到服务器。通常默认方法为 默认方法使用浏览器的默认设置将表单数据发送到服务器。通常默认方法为 GET GET 方方

法法。。 “ “MIMEMIME 类型”:弹出菜单指定对提交给服务器进行处理的数据使用 类型”:弹出菜单指定对提交给服务器进行处理的数据使用 MIME MIME 编码编码类型。类型。 “ “ 目标”:弹出菜单指定一个窗口,在该窗口中显示被调用程序所返回的数据。如目标”:弹出菜单指定一个窗口,在该窗口中显示被调用程序所返回的数据。如果命名的窗口尚未打开,则打开一个具有该名称的新窗口果命名的窗口尚未打开,则打开一个具有该名称的新窗口 。 。 “ “ 类”:使您可以将 类”:使您可以将 CSS CSS 规则应用于对象规则应用于对象 。。

4.2    新知解析

Page 7: 学习目标

4.7

5 5 表单的应用表单的应用

2.2. 文本字段属性面板设置项目:文本字段属性面板设置项目:

““ 字符宽度”:设置域中最多可显示的字符数。字符宽度”:设置域中最多可显示的字符数。 ““ 最多字符数”:设置单行文本域中最多可输入的字符数。 最多字符数”:设置单行文本域中最多可输入的字符数。 ““ 行数”:设置多行文本域的域高度(在选中了“多行”选项时可用)。行数”:设置多行文本域的域高度(在选中了“多行”选项时可用)。““ 换行”:指定当用户输入的信息较多,无法在定义的文本区域内显示时,如何显示换行”:指定当用户输入的信息较多,无法在定义的文本区域内显示时,如何显示用户输入的内容(在选中了“多行”选项时可用)。用户输入的内容(在选中了“多行”选项时可用)。 ““ 类型”:指定域为单行、多行还是密码域。 类型”:指定域为单行、多行还是密码域。 ““ 初始值”:指定在首次载入表单时域中显示的值。 初始值”:指定在首次载入表单时域中显示的值。

4.2    新知解析

Page 8: 学习目标

4.8

5 5 表单的应用表单的应用

3.3. 单选按钮属性面板设置项目:单选按钮属性面板设置项目:

“ “ 单选按钮”:文本框中为该对象指定一个名称。单选按钮”:文本框中为该对象指定一个名称。 “ “ 选定值”:设置在该单选按钮被选中时发送给服务器的值。选定值”:设置在该单选按钮被选中时发送给服务器的值。 ““ 初始状态”:确定在浏览器中载入表单时,该单选按钮是否被选中。初始状态”:确定在浏览器中载入表单时,该单选按钮是否被选中。

4.2    新知解析

Page 9: 学习目标

4.9

5 5 表单的应用表单的应用

4.4. 单选按钮组设置项目:单选按钮组设置项目:

“ “ 名称”:文本框中输入该单选按钮组的名称。名称”:文本框中输入该单选按钮组的名称。 “ “ 单选按钮”:单击加号 单选按钮”:单击加号 (+) (+) 按钮向组添加一个单选按钮,如果需要可以为新按按钮向组添加一个单选按钮,如果需要可以为新按钮输入标签和选定值。单击向上或向下箭头重新对这些按钮排序。钮输入标签和选定值。单击向上或向下箭头重新对这些按钮排序。 ““ 布局,使用”:可以使用换行符或表格来设置这些按钮的布局。布局,使用”:可以使用换行符或表格来设置这些按钮的布局。

4.2    新知解析

Page 10: 学习目标

4.10

5 5 表单的应用表单的应用

5.5. 按钮属性面板设置项目:按钮属性面板设置项目:

“ “ 按钮名称”:为该按钮指定一个名称。按钮名称”:为该按钮指定一个名称。 “ “ 值”:确定按钮上显示的文本。值”:确定按钮上显示的文本。 ““ 动作”:选中了“提交表单”选项,当单击该按钮时将提交表单数据进行处理,动作”:选中了“提交表单”选项,当单击该按钮时将提交表单数据进行处理,

该数据将被提交到表单的“动作”属性中指定的页面或脚本。该数据将被提交到表单的“动作”属性中指定的页面或脚本。

4.2    新知解析

Page 11: 学习目标

4.11

5 5 表单的应用表单的应用

6.6. 复选框属性面板设置项目:复选框属性面板设置项目:

“ “ 复选框”:为该对象指定一个名称,每个复选框都必须有一个唯一名称。复选框”:为该对象指定一个名称,每个复选框都必须有一个唯一名称。 “ “ 选定值”:设置在该复选框被选中时发送给服务器的值。选定值”:设置在该复选框被选中时发送给服务器的值。 ““ 初始状态”:确定在浏览器中载入表单时,该复选框是否被选中。初始状态”:确定在浏览器中载入表单时,该复选框是否被选中。

4.2    新知解析

Page 12: 学习目标

4.12

5 5 表单的应用表单的应用

7. 7. 列表列表 // 菜单菜单属性面板设置项目:属性面板设置项目:

“ “ 列表列表 // 菜单”:为该菜单指定一个名称。 菜单”:为该菜单指定一个名称。 “ “ 类型”:指定该菜单是单击时下拉的菜单(“菜单”选项),还是显示一个列有类型”:指定该菜单是单击时下拉的菜单(“菜单”选项),还是显示一个列有项目的可滚动列表(“列表”选项)。 项目的可滚动列表(“列表”选项)。 “ “ 高度”:(仅“列表”类型)设置菜单中显示的项数。 高度”:(仅“列表”类型)设置菜单中显示的项数。 ““ 选定范围”:(仅“列表”类型)指定用户是否可以从列表中选择多个项。 选定范围”:(仅“列表”类型)指定用户是否可以从列表中选择多个项。 ““ 列表值”:打开一个对话框,您可以在该对话框中向菜单中添加菜单项。使用加号 列表值”:打开一个对话框,您可以在该对话框中向菜单中添加菜单项。使用加号 (+) (+) 和减号 和减号 (-) (-) 按钮添加和删除列表中的项。 按钮添加和删除列表中的项。 ““ 初始化时选定”:设置列表中默认选择的菜单项。初始化时选定”:设置列表中默认选择的菜单项。

4.2 新知解析

Page 13: 学习目标

4.13

5 5 表单的应用表单的应用

8.8. 图像域属性面板设置项目:图像域属性面板设置项目:

“ “ 图像区域”:为该按钮指定一个名称。图像区域”:为该按钮指定一个名称。 “ “源文件”:指定要为该按钮使用的图像。源文件”:指定要为该按钮使用的图像。 “ “替代”:用于输入描述性文本,一旦图像在浏览器中载入失败,将显示这些文本。替代”:用于输入描述性文本,一旦图像在浏览器中载入失败,将显示这些文本。 “ “ 对齐”:设置对象的对齐属性。对齐”:设置对象的对齐属性。 “ “ 编辑图像”:启动默认的图像编辑器并打开该图像文件进行编辑。编辑图像”:启动默认的图像编辑器并打开该图像文件进行编辑。

4.2    新知解析

Page 14: 学习目标

4.14

5 5 表单的应用表单的应用

9.9. 文件域属性面板设置项目:文件域属性面板设置项目:

“ “ 文件域名称”:指定该文件域对象的名称。文件域名称”:指定该文件域对象的名称。 “ “ 字符宽度”:指定希望该域最多可显示的字符数。字符宽度”:指定希望该域最多可显示的字符数。 “ “ 最多字符数”:指定域中最多可容纳的字符数。如果用户通过浏览来定位文件,则最多字符数”:指定域中最多可容纳的字符数。如果用户通过浏览来定位文件,则文件名和路径可超过指定的“最多字符数”的值。但是,如果用户尝试键入文件名和路径,文件名和路径可超过指定的“最多字符数”的值。但是,如果用户尝试键入文件名和路径,则文件域仅允许键入“最多字符数”值所指定的字符数。则文件域仅允许键入“最多字符数”值所指定的字符数。

4.2    新知解析

Page 15: 学习目标

4.15

5 5 表单的应用表单的应用

10.10. 跳转菜单设置项目:跳转菜单设置项目: “ “+”+” 和“和“ -”-” : 单击加号按钮添加一个菜单项,再次单击该按钮添加另一个菜单项,: 单击加号按钮添加一个菜单项,再次单击该按钮添加另一个菜单项,选定一个菜单项,然后单击减号按钮可将其删除。选定一个菜单项,然后单击减号按钮可将其删除。 “ “ 菜单项”菜单项” : : 选定一个,然后用箭头键在列表中向上或向下移动此菜单项。选定一个,然后用箭头键在列表中向上或向下移动此菜单项。 “ “ 文本”文本” : : 文本框中为菜单项键入要在菜单列表中显示的文本。文本框中为菜单项键入要在菜单列表中显示的文本。 “ “ 打开 打开 URL URL 于”于” : : 在弹出菜单中选择文件的打开位置在弹出菜单中选择文件的打开位置 。。 “ “ 菜单名称”菜单名称” : : 在文本框中,键入菜单项的名称。在文本框中,键入菜单项的名称。 “ “ 选项”选项” :“:“ 菜单之后插入前往按钮”,可添加一个“前往”按钮,而非菜单选择提示。菜单之后插入前往按钮”,可添加一个“前往”按钮,而非菜单选择提示。如果要使用菜单选择提示,请选择“选项”下的“更改 如果要使用菜单选择提示,请选择“选项”下的“更改 URL URL 后选择第一个项目”。后选择第一个项目”。

4.2    新知解析

Page 16: 学习目标

4.16

5 5 表单的应用表单的应用

4.3 实战演练:网络写作注册信息表   

4.3 4.3 实战演练:网络写作注册信息表实战演练:网络写作注册信息表

通过本案例的操作,通过本案例的操作,你将学会:如何在网页布你将学会:如何在网页布局中建立表单域和利用表局中建立表单域和利用表格定位表单对象、如何插格定位表单对象、如何插入表单对象和设置表单对入表单对象和设置表单对象属性。象属性。