建立旅游电子商务网站实践讲稿.ppt

建立旅游电子商务网站实践建立旅游电子商务网站实践第一页，讲稿共七十页哦5.1.1超链接概述超链接概述超链接是用准备好的文本、按钮、图像等对象与其他对象建超链接是用准备好的文本、按钮、图像等对象与其他对象建立链接，也就是在立链接，也就是在源端点和目标端点源端点和目标端点之间建立一种链接。之间建立一种链接。源端点是超链接的起始端点，目标端点是链接的对象，也称源端点是超链接的起始端点，目标端点是链接的对象，也称为目标锚。为目标锚。超链接按源端点的链接划分，分为超文本链接和非超文超链接按源端点的链接划分，分为超文本链接和非超文本链接两类本链接两类。超文本链接的源锚文本下方有下划线。非超文本链接是。超文本链接的源锚文本下方有下划线。非超文本链接是用除文本之外的其他对象构建的链接，源锚可以是图像、表格、列表、用除文本之外的其他对象构建的链接，源锚可以是图像、表格、列表、表单、多媒体等对象。表单、多媒体等对象。超链接按目标端点的链接划分，可分为外部链超链接按目标端点的链接划分，可分为外部链接、内部链接、电子邮件链接、局部链接、脚本链接等接、内部链接、电子邮件链接、局部链接、脚本链接等。5.1 超链接及其应用超链接及其应用第二页，讲稿共七十页哦在超链接中，链接路径是通过在超链接中，链接路径是通过URL（统一资源定位符，统一资源定位符，英语英语Uniform Resource Locator的缩写，也被称的缩写，也被称为网页地址，是因特网上标准的资源的地址。为网页地址，是因特网上标准的资源的地址。）来）来确定的。根据使用的协议不同，确定的。根据使用的协议不同，URL的形式也不同，常用的形式的形式也不同，常用的形式有有HTTP、FTP和和File等几种等几种。（1）HTTP开头的开头的URL通常指向通常指向WWW服务器，通常称为网址；服务器，通常称为网址；（2）FTP开头的开头的URL主要用于文件的传递，包括文件的上传和下载；主要用于文件的传递，包括文件的上传和下载；（3）File开头的开头的URL主要访问本地计算机中的文件信息。主要访问本地计算机中的文件信息。在超链接中，在超链接中，使用完整的使用完整的URL地址的链接路径称为绝对路径。地址的链接路径称为绝对路径。绝对路径指明目标端点所在的具体位置。绝对路径指明目标端点所在的具体位置。在超链接中，指明目标在超链接中，指明目标端点与源端点的相对位置关系的路径称为相对路径。端点与源端点的相对位置关系的路径称为相对路径。第三页，讲稿共七十页哦(1)在网页编辑窗口中选中源端点对象，然后选择在网页编辑窗口中选中源端点对象，然后选择【修改】【修改】|【创建链接】创建链接】命令，打开【选择文件】对话框，选中目标端点便可创命令，打开【选择文件】对话框，选中目标端点便可创建链接。建链接。(2)在网页编辑窗口中选中源端点对象后，鼠标右击，在快捷菜单在网页编辑窗口中选中源端点对象后，鼠标右击，在快捷菜单中选择【创建链接】命令，打开【选择文件】对话框，选中目标中选择【创建链接】命令，打开【选择文件】对话框，选中目标端点便可创建链接。端点便可创建链接。(3)在网页编辑窗口中选中源端点对象，然后在属性面板的【链接】文在网页编辑窗口中选中源端点对象，然后在属性面板的【链接】文本框中输入目标端点及路径便可创建超链接。或单击【链接】文本框右本框中输入目标端点及路径便可创建超链接。或单击【链接】文本框右边的按钮，打开【选择文件】对话框，选择目标端点便可创建超链接，边的按钮，打开【选择文件】对话框，选择目标端点便可创建超链接，如图如图5-1所示。所示。5.1.2 创建超链接的方法创建超链接的方法第四页，讲稿共七十页哦图图5-1创建超链接的属性面板创建超链接的属性面板第五页，讲稿共七十页哦电子邮件链接的方式在很多网页中都被广泛地电子邮件链接的方式在很多网页中都被广泛地采用，当浏览者单击该链接时，系统会启动电子邮采用，当浏览者单击该链接时，系统会启动电子邮件发送程序（如件发送程序（如Outlook Express），），并将网页设并将网页设计者的邮件地址放在【收件人】文本框中，为浏览计者的邮件地址放在【收件人】文本框中，为浏览者发送电子邮件做好准备，这种链接方式方便了信者发送电子邮件做好准备，这种链接方式方便了信息的交流与反馈。息的交流与反馈。5.1.4 创建电子邮件链接创建电子邮件链接第六页，讲稿共七十页哦在网页上创建电子邮件链接的步骤如下。在网页上创建电子邮件链接的步骤如下。（1）在网页上选择准备作为电子邮件链接的在网页上选择准备作为电子邮件链接的文字文字，如如“请与我联系请与我联系”、“请提意见请提意见”等。等。（2）选择选择【插入】【插入】|【电子邮件链接】命令【电子邮件链接】命令，或者，或者在【插入】栏板的在【插入】栏板的【常用】选项卡中单击插入【电【常用】选项卡中单击插入【电子邮件链接】子邮件链接】按钮，此时网页编辑窗口弹出【电子按钮，此时网页编辑窗口弹出【电子邮件链接】对话框，如图邮件链接】对话框，如图5-4所示。所示。（3）在在E-mail文本框中输入自己的电子邮件地址，文本框中输入自己的电子邮件地址，然后单击【确定】按钮。然后单击【确定】按钮。第七页，讲稿共七十页哦图图5-4【电子邮件链接】对话框【电子邮件链接】对话框第八页，讲稿共七十页哦在网页上创建电子邮件链接的另一种方法的操作步在网页上创建电子邮件链接的另一种方法的操作步骤如下。骤如下。（1）在网页上选中准备作为电子邮件链接的在网页上选中准备作为电子邮件链接的源端源端点对象。点对象。（2）在【属性】面板的【链接】文本框中输入在【属性】面板的【链接】文本框中输入“mailto:电子邮件地址电子邮件地址”，如图，如图5-5所示。所示。（3）按回车键，便可创建一个电子邮件链接。按回车键，便可创建一个电子邮件链接。图图5-5在【属性】面板中设置电子邮件链接在【属性】面板中设置电子邮件链接第九页，讲稿共七十页哦通常在网页的首页上可设置一个通常在网页的首页上可设置一个导航条导航条，这样，这样既可为浏览者浏览网站提供一个索引，又能引导浏既可为浏览者浏览网站提供一个索引，又能引导浏览者浏览整个网站的不同页面。览者浏览整个网站的不同页面。导航条又称导航栏导航条又称导航栏，可由一幅或多幅按钮图像，可由一幅或多幅按钮图像组成，按钮图像的状态根据浏览者的鼠标动作而改组成，按钮图像的状态根据浏览者的鼠标动作而改变。当鼠标移到、移出或单击图像时，该图像就会变。当鼠标移到、移出或单击图像时，该图像就会被替换成另一幅图像。被替换成另一幅图像。在创建导航条之前，在创建导航条之前，应先准备好导航条中要用应先准备好导航条中要用的图片。的图片。这些图片分别表示导航条某个按钮不同动这些图片分别表示导航条某个按钮不同动作的状态。在网页上创建导航条的操作步骤如下。作的状态。在网页上创建导航条的操作步骤如下。5.1.5 创建导航条创建导航条第十页，讲稿共七十页哦（1）在网页上选择插入导航条的位置。在网页上选择插入导航条的位置。（2）选择选择【插入】【插入】|【图像对象】【图像对象】|【导航条】【导航条】命命令，或者在【插入】栏的令，或者在【插入】栏的【常用】选项卡中，单击【常用】选项卡中，单击【导航条】按钮【导航条】按钮，此时在网页编辑窗口中会弹出【，此时在网页编辑窗口中会弹出【插入导航条】对话框，如图插入导航条】对话框，如图5-6所示。所示。（3）在【项目名称】文本框中输入导航条元素的在【项目名称】文本框中输入导航条元素的名称，名称，名称对中文不支持名称对中文不支持。所输入的名称将在【导。所输入的名称将在【导航条元件】列表框里显示。可用按钮、调整导航条航条元件】列表框里显示。可用按钮、调整导航条中元素的次序。中元素的次序。第十一页，讲稿共七十页哦图图5-6【插入导航条】对话框【插入导航条】对话框第十二页，讲稿共七十页哦（4）分别单击【状态图像】、【鼠标经过图像】、【按下图分别单击【状态图像】、【鼠标经过图像】、【按下图像】、【按下时鼠标经过图像】像】、【按下时鼠标经过图像】4个文本框右侧的【浏览】按个文本框右侧的【浏览】按钮，选择图像。这些图像的意义分别是：钮，选择图像。这些图像的意义分别是：【状态图像】表示的图像为页面载入时的初始图像；【状态图像】表示的图像为页面载入时的初始图像；【鼠标经过图像】表示的图像为鼠标移到【导航条】按钮上时所【鼠标经过图像】表示的图像为鼠标移到【导航条】按钮上时所显示的图像；显示的图像；【按下图像】表示的图像为鼠标单击【导航条】按钮时所显示的图像；【按下图像】表示的图像为鼠标单击【导航条】按钮时所显示的图像；【按下时鼠标经过图像】表示的图像是单击【导航条】按钮后将光【按下时鼠标经过图像】表示的图像是单击【导航条】按钮后将光标移去时所显示的图像。标移去时所显示的图像。第十三页，讲稿共七十页哦（5）在【替换文本】的文本框中，输入该【导航条】按钮的替在【替换文本】的文本框中，输入该【导航条】按钮的替换文字。换文字。（6）在【按下时，前往的在【按下时，前往的URL】文本框中，输入要链接的网页文本框中，输入要链接的网页地址，并在右侧的下拉列表框中，选择在何处打开要链接的网页。地址，并在右侧的下拉列表框中，选择在何处打开要链接的网页。（7）如果要在打开网页时先将图像装载到内存中，应选中【预如果要在打开网页时先将图像装载到内存中，应选中【预先载入图像】复选框。先载入图像】复选框。（8）如果要在导航条上显示【按下时鼠标经过图像】的图像，如果要在导航条上显示【按下时鼠标经过图像】的图像，可选中【页面载入时就显示可选中【页面载入时就显示“鼠标按下图像鼠标按下图像”】复选框。】复选框。（9）在【插入】下拉列表框中选择【水平】或【垂直】选项，在【插入】下拉列表框中选择【水平】或【垂直】选项，在网页上水平或垂直放置导航条。在网页上水平或垂直放置导航条。第十四页，讲稿共七十页哦（10）如果要将导航条插入表格中，则选中【使用表格】复选框。如果要将导航条插入表格中，则选中【使用表格】复选框。（11）单击、按钮，可将该【导航条】按钮加入导航条中或从导航单击、按钮，可将该【导航条】按钮加入导航条中或从导航条中移去。条中移去。（12）重复第重复第(3)(11)步，插入导航条中的其他按钮。步，插入导航条中的其他按钮。（13）完成后，单击【确定】按钮，并返回网页编辑窗口。完成后，单击【确定】按钮，并返回网页编辑窗口。（14）按按F12键预览网页。键预览网页。如果要修改导航条，可以选择【修改】如果要修改导航条，可以选择【修改】|【导航条】命令，在【导航条】命令，在弹出的【修改导航条】对话框中修改导航条。弹出的【修改导航条】对话框中修改导航条。第十五页，讲稿共七十页哦跳转菜单是一个下拉式菜单跳转菜单是一个下拉式菜单，其中的每一个选，其中的每一个选项都是一个超链接。设计者可以用跳转菜单创建网项都是一个超链接。设计者可以用跳转菜单创建网站站点的各种链接，实现网页之间的跳转链接。站站点的各种链接，实现网页之间的跳转链接。要在网页上添加一个跳转菜单，操作步骤如下。要在网页上添加一个跳转菜单，操作步骤如下。（1）在网页的合适位置插入光标，在网页的合适位置插入光标，选择【插入】选择【插入】|【表单对象】【表单对象】|【跳转菜单】命令【跳转菜单】命令。或者在【插入】。或者在【插入】浮动面板的【表单】选项卡中，浮动面板的【表单】选项卡中，单击【跳转菜单】单击【跳转菜单】按钮按钮，也可以，也可以拖曳【跳转菜单】按钮拖曳【跳转菜单】按钮到当前网页的到当前网页的光标处。光标处。5.1.6 创建跳转菜单创建跳转菜单第十六页，讲稿共七十页哦（2）网页编辑窗口弹出【插入跳转菜单】对话框，网页编辑窗口弹出【插入跳转菜单】对话框，如图如图5-7所示。如果要在跳转菜单中创建一个提示所示。如果要在跳转菜单中创建一个提示选项，可在【文本】框中输入提示内容的文字，然选项，可在【文本】框中输入提示内容的文字，然后【选项】区域里选中【更改后【选项】区域里选中【更改URL后选择第一个项后选择第一个项目】复选框。这一选项是菜单提示性质的说明，单目】复选框。这一选项是菜单提示性质的说明，单击按钮添加这个提示项。击按钮添加这个提示项。（3）在【文本】文本框中，输入跳转菜单其他选在【文本】文本框中，输入跳转菜单其他选项的名字。项的名字。第十七页，讲稿共七十页哦（4）单击【选择时，前往单击【选择时，前往URL】文本框中右侧的文本框中右侧的【浏览】按钮，输入该菜单选项所链接的页面文件【浏览】按钮，输入该菜单选项所链接的页面文件和路径。和路径。图图5-7【插入跳转菜单】对话框【插入跳转菜单】对话框第十八页，讲稿共七十页哦（5）在【打开在【打开URL于】下拉列表框中，选择链接于】下拉列表框中，选择链接页面文件的显示方式。页面文件的显示方式。（6）要想继续添加菜单选项，可单击按钮，然后要想继续添加菜单选项，可单击按钮，然后重复第重复第(3)(6)步的操作。步的操作。（7）如果在跳转菜单右边添加一个提交按钮，可如果在跳转菜单右边添加一个提交按钮，可选中【菜单之后插入前往按钮】复选框。如果要在选中【菜单之后插入前往按钮】复选框。如果要在选择了某个菜单选项后重新返回再选择第一个菜单选择了某个菜单选项后重新返回再选择第一个菜单项，可选中【更改项，可选中【更改URL后选择第一个项目】复选框。后选择第一个项目】复选框。（8）完成设置后，单击【确定】按钮。完成设置后，单击【确定】按钮。（9）按按F12键预览网页，显示结果如图键预览网页，显示结果如图5-8所示。所示。第十九页，讲稿共七十页哦图图5-8带跳转按钮的跳转菜单带跳转按钮的跳转菜单第二十页，讲稿共七十页哦跳转菜单的跳转功能是由跳转菜单的跳转功能是由JavaScript脚本代码脚本代码来实现的，这些代码是由来实现的，这些代码是由Dreamweaver 8添加到添加到网页文档中的。跳转菜单的修改较为方便。网页文档中的。跳转菜单的修改较为方便。修改跳转菜单的操作步骤如下：修改跳转菜单的操作步骤如下：（1）在网页文档中，选中要修改的跳转菜单。在网页文档中，选中要修改的跳转菜单。（2）在【属性】面板中，显示的跳转菜单如图在【属性】面板中，显示的跳转菜单如图5-9所示，单击【列表值】按钮。所示，单击【列表值】按钮。（3）在弹出的【列表值】对话框中，修改菜单选在弹出的【列表值】对话框中，修改菜单选项，如图项，如图5-10所示。所示。（4）修改完成后，单击【确定】按钮。修改完成后，单击【确定】按钮。第二十一页，讲稿共七十页哦图图5-9转跳菜单的【属性】面板转跳菜单的【属性】面板图图5-10【列表值】对话框【列表值】对话框第二十二页，讲稿共七十页哦热点链接是在一个图像中划分出几个不同的几热点链接是在一个图像中划分出几个不同的几何图形区域，然后分别为这个图像不同的几何图形何图形区域，然后分别为这个图像不同的几何图形区域建立超链接，图像中建立超链接的几何图形区区域建立超链接，图像中建立超链接的几何图形区域称为热点。域称为热点。浏览时，当热点被单击后就会完成相应的超链浏览时，当热点被单击后就会完成相应的超链接操作，不同的热点对应于不同的超链接，这就是接操作，不同的热点对应于不同的超链接，这就是图像的热点链接。图像的热点链接。5.1.7 创建热点链接创建热点链接第二十三页，讲稿共七十页哦创建创建热点热点链接的操作步骤如下。链接的操作步骤如下。（1）在网页编辑窗口中在网页编辑窗口中插入一幅图像插入一幅图像，并选中这，并选中这幅图像。幅图像。（2）此时在图像的【属性】面板左下方有一个名此时在图像的【属性】面板左下方有一个名为【地图】的文本框，如图为【地图】的文本框，如图5-11所示，可在所示，可在其中输其中输入入热点热点链接的名称链接的名称。若不输入内容，若不输入内容，Dreamweaver 8将会自动加上将会自动加上一个一个热点热点链接的名字。链接的名字。第二十四页，讲稿共七十页哦图图5-11图像的【属性】面板图像的【属性】面板第二十五页，讲稿共七十页哦（3）在【地图】文本框下面有在【地图】文本框下面有4个图标按钮个图标按钮，分，分别是别是选择编辑箭头选择编辑箭头、矩形、矩形热点热点、圆形、圆形热点热点和多边形和多边形热热点工具点工具，这些图标的功能分别是，这些图标的功能分别是调整热点区域调整热点区域，创，创建矩形、圆形和不规则多边形的热点区域。建矩形、圆形和不规则多边形的热点区域。（4）单击创建多边形热点区域的图标，然后用鼠单击创建多边形热点区域的图标，然后用鼠标依次在选作标依次在选作热点热点链接的几何图形外部轮廓线上依链接的几何图形外部轮廓线上依次单击，可定义一个多边形的热区，如图次单击，可定义一个多边形的热区，如图5-12所示。所示。（5）如果用鼠标单击矩形或圆形图标，然后在选如果用鼠标单击矩形或圆形图标，然后在选作作热点热点的外部轮廓线上拖曳鼠标，可定义矩形或圆的外部轮廓线上拖曳鼠标，可定义矩形或圆形的热区，如图形的热区，如图5-12所示。所示。第二十六页，讲稿共七十页哦图图5-12定义热点链接定义热点链接第二十七页，讲稿共七十页哦（6）当一个热区被选定后，图像的【属性】面板当一个热区被选定后，图像的【属性】面板变成变成图像热点的【属性】面板图像热点的【属性】面板，如图，如图5-12所示。所示。（7）单击图像热点的【属性】面板中【链接】文单击图像热点的【属性】面板中【链接】文本框右边的图标，选择当前热区链接的文件。或者本框右边的图标，选择当前热区链接的文件。或者直接在直接在【链接】【链接】文本框中输入链接文件的路径和名文本框中输入链接文件的路径和名称。称。（8）在【目标】下拉列表框中设置链接的目标对在【目标】下拉列表框中设置链接的目标对象的显示方式。象的显示方式。（9）在【替代】文本框中输入所定义的热区的说在【替代】文本框中输入所定义的热区的说明文字。在浏览网页时，鼠标指在热区上将会显示明文字。在浏览网页时，鼠标指在热区上将会显示【替代】文本框中的说明文字。【替代】文本框中的说明文字。第二十八页，讲稿共七十页哦（10）重复以上第重复以上第(7)(9)步，完成其他热区的步，完成其他热区的编辑。编辑。如果热区选择有误，可按如果热区选择有误，可按Delete键将其删除。键将其删除。也可单击【地图】文本框下面的图标，用鼠标拖曳也可单击【地图】文本框下面的图标，用鼠标拖曳热区上的控制点调整热区，改变其大小；热区上的控制点调整热区，改变其大小；或用键盘或用键盘的上、下、左、右方向键移动选定的热区，改变其的上、下、左、右方向键移动选定的热区，改变其位置。位置。第二十九页，讲稿共七十页哦图图5-13 应用实例的图示应用实例的图示第三十页，讲稿共七十页哦第第8章章 表单及应用表单及应用8.1 交互式表单概述交互式表单概述8.2 创建表单创建表单8.3 表单应用实例表单应用实例第三十一页，讲稿共七十页哦表单（表单（Form）技术可以实现浏览者同）技术可以实现浏览者同Internet服务服务器之间信息的交互传送，它是网络信息收集处理的器之间信息的交互传送，它是网络信息收集处理的一种重要的方式。一种重要的方式。通过表单可以从网络的用户端收通过表单可以从网络的用户端收集信息，然后将收集来的信息经过服务器处理后再集信息，然后将收集来的信息经过服务器处理后再返馈给用户。返馈给用户。无论是电子商务、网上调查，还是留无论是电子商务、网上调查，还是留言板、聊天室，都要求网页能够接收浏览者输入的言板、聊天室，都要求网页能够接收浏览者输入的信息，而表单就是网站获取用户信息的最重要的手信息，而表单就是网站获取用户信息的最重要的手段之一。段之一。1 交互式表单概述交互式表单概述第三十二页，讲稿共七十页哦浏览者在网页上看到有关表单的页面，只是供浏览浏览者在网页上看到有关表单的页面，只是供浏览者输入信息的表单页面。当浏览者按要求在表单中者输入信息的表单页面。当浏览者按要求在表单中填写有关信息，单击表单的递交（填写有关信息，单击表单的递交（Submit）按钮）按钮之后，表单内容就会上传到服务器，并且由事先编之后，表单内容就会上传到服务器，并且由事先编好的服务器端程序来处理这些信息，最后服务器再好的服务器端程序来处理这些信息，最后服务器再将处理结果发送给浏览者的浏览器。由此可见，表将处理结果发送给浏览者的浏览器。由此可见，表单的应用必须依赖于服务器端脚本才能真正发挥其单的应用必须依赖于服务器端脚本才能真正发挥其功能。功能。第三十三页，讲稿共七十页哦表单主要的功能是接收输入的信息。表单主要的功能是接收输入的信息。浏览者输入的信息可以是多种浏览者输入的信息可以是多种多样的，这些不同类别的信息可以由不同的表单域分别接收。因为多样的，这些不同类别的信息可以由不同的表单域分别接收。因为每个表单域对应一个项目，所以每个表单域都要添加一个标识，提每个表单域对应一个项目，所以每个表单域都要添加一个标识，提醒用户在这个表单域中应该输入的内容。醒用户在这个表单域中应该输入的内容。在网页中创建一个表单的在网页中创建一个表单的方法有方法有3种种。（1）菜单栏：菜单栏：【插入插入】|【表单表单】|【表单表单】命令，便可在网页命令，便可在网页的指定位置上插入一个的指定位置上插入一个红色虚线红色虚线构成的表单区域。构成的表单区域。（2）工具栏：工具栏：【插入插入】栏栏【表单表单】选项中的选项中的【表单表单】按钮按钮 。（3）直接将）直接将【插入插入】栏栏【表单表单】选项中的选项中的【表单表单】按钮按钮 拖入拖入网页网页文档窗口的表单插入区域。文档窗口的表单插入区域。8.2 创建表单创建表单第三十四页，讲稿共七十页哦红色虚线框确定了当前表单的边框，这种红色边框红色虚线框确定了当前表单的边框，这种红色边框的大小是不能被编辑的。当设计者在表单区域中插的大小是不能被编辑的。当设计者在表单区域中插入对象后，入对象后，表单的区域会自动调整其大小表单的区域会自动调整其大小。在创建表单后，就可以在表单中插入各种表单在创建表单后，就可以在表单中插入各种表单域。要在网页中域。要在网页中插入表单域有两种方法插入表单域有两种方法，一种是菜，一种是菜单命令；另一个是工具栏。单命令；另一个是工具栏。第三十五页，讲稿共七十页哦下面先简要介绍下面先简要介绍Dreamweaver 8的表单域的特点。的表单域的特点。文本字段文本字段 ：用来输入的文字或数字用来输入的文字或数字。文本区域文本区域 ：插入的文本可显示为单行、多行，但：插入的文本可显示为单行、多行，但是浏览者输入文字较麻烦，故在表单中应少用文本是浏览者输入文字较麻烦，故在表单中应少用文本框，尽可能使用其它的表单对象。框，尽可能使用其它的表单对象。按钮按钮 ：表单中一般有两个按钮，一个是：表单中一般有两个按钮，一个是【提交提交】按钮，单击此按钮可把浏览者输入的信息发送给服按钮，单击此按钮可把浏览者输入的信息发送给服务器；另一个是务器；另一个是【重置重置】按钮，用来清除表单中的按钮，用来清除表单中的内容，把当前表单还原为初始状态。内容，把当前表单还原为初始状态。复选框复选框 ：复选框可以单独使用，也可以成组使用，：复选框可以单独使用，也可以成组使用，有选中与不选中两种状态。有选中与不选中两种状态。单选按钮单选按钮 ：单选按钮常用于：单选按钮常用于一组互斥一组互斥选择（如选择（如“男男”、“女女”等）。等）。单选按钮组单选按钮组 ：创建一组在表单中使用的单选按钮创建一组在表单中使用的单选按钮。“标签标签”处可改数值。处可改数值。第三十六页，讲稿共七十页哦列表列表/菜单按钮菜单按钮 ：常用于提交一组可供浏览者进行选择的列表：常用于提交一组可供浏览者进行选择的列表选项。其表现方式为当单击它右侧的选项。其表现方式为当单击它右侧的 按钮时，弹出一个下拉式按钮时，弹出一个下拉式列表。浏览者可单击列表中某一选项。它在功能上与单选按钮相列表。浏览者可单击列表中某一选项。它在功能上与单选按钮相似，可以提供浏览者在多个备选项中作一个选择，它占有网页的似，可以提供浏览者在多个备选项中作一个选择，它占有网页的面积比单选按钮小的多。面积比单选按钮小的多。文件域文件域 ：文件域有一个文本框和一个浏览按钮。让浏览者从本地计：文件域有一个文本框和一个浏览按钮。让浏览者从本地计算机上用表单向服务器上传文件。算机上用表单向服务器上传文件。隐藏域隐藏域 ：表单的隐藏域在浏览时是看不到的表单的隐藏域在浏览时是看不到的，浏览者也不能执，浏览者也不能执行该操作。利用隐藏域可以实现浏览器同服务器在后台不公开地行该操作。利用隐藏域可以实现浏览器同服务器在后台不公开地交换信息。交换信息。图片域图片域 ：用于显示图片，也可用作确认按钮。：用于显示图片，也可用作确认按钮。跳转菜单跳转菜单 ：插入一个跳转菜单，每个菜单选项都可链接到：插入一个跳转菜单，每个菜单选项都可链接到一个网页或文件。一个网页或文件。第三十七页，讲稿共七十页哦表单中的文本框是网页中常见一种表单元素，网页表单中的文本框是网页中常见一种表单元素，网页中表单的文本框包括中表单的文本框包括3种形式。种形式。【单行文本框单行文本框】是浏览者只能输入一行信息的文本是浏览者只能输入一行信息的文本区域。区域。【多行文本框多行文本框】是可由网页设计者限定文本的行数，是可由网页设计者限定文本的行数，并决定是否显示滚动条，浏览者可在这种文本框中并决定是否显示滚动条，浏览者可在这种文本框中输入多行文本信息。输入多行文本信息。【密码密码】文本框是一种可以让浏览者输入密码信息文本框是一种可以让浏览者输入密码信息的文本框，输入的字符都以的文本框，输入的字符都以“*”号显示在屏幕上。号显示在屏幕上。8.2.1 创建表单的文本框创建表单的文本框第三十八页，讲稿共七十页哦下面将介绍创建一个带有文本框的最基本的表单，下面将介绍创建一个带有文本框的最基本的表单，通过创建这个简单的表单来了解通过创建这个简单的表单来了解表单创建的过程表单创建的过程，其操作步骤如下：其操作步骤如下：（1）在网页文档窗口中，确定要插入的表单位置。）在网页文档窗口中，确定要插入的表单位置。（2）单击）单击【表单表单】选项中的选项中的【表单表单】按钮，便可在按钮，便可在网页编辑区中生成一个表单。此时表单被一个红色网页编辑区中生成一个表单。此时表单被一个红色虚线框界定。单击红色虚线框，可以选中表单区域，虚线框界定。单击红色虚线框，可以选中表单区域，在在【属性属性】面板中显示了这个表单区域的属性。面板中显示了这个表单区域的属性。第三十九页，讲稿共七十页哦表单的表单的【属性属性】面板中各属性具体意义如下。面板中各属性具体意义如下。在在【表单名称表单名称】文本框中输入指定表单的名称，文本框中输入指定表单的名称，表表单的名称必须唯一单的名称必须唯一。在在【动作动作】文本框中可以输入一个文本框中可以输入一个URL，用来指定，用来指定处理表单信息的服务端的程序。也可以输入处理表单信息的服务端的程序。也可以输入mailto：邮件地址，用：邮件地址，用Email方式来发送表单中的数据。方式来发送表单中的数据。在在【方法方法】下拉式列表中指定一个处理表单数据的下拉式列表中指定一个处理表单数据的方法，其下拉列表中的各项意义如下所述。方法，其下拉列表中的各项意义如下所述。默认：使用浏览器的默认方式，一般为默认：使用浏览器的默认方式，一般为GET方式。方式。GET：表示把表单值附加到：表示把表单值附加到URL，并发送给服务器，并发送给服务器一个一个GET请求。请求。第四十页，讲稿共七十页哦POST：以消息方式发送表单的值，并发送给服：以消息方式发送表单的值，并发送给服务器一个务器一个POST请求。请求。在在【目标目标】下拉式列表中指定一个下拉式列表中指定一个窗口方式，在该窗口方式，在该窗口中显示调用程序所返回的数据。窗口中显示调用程序所返回的数据。在【在【MIME类型类型】下拉式列表下拉式列表可以指定对提交给服可以指定对提交给服务器进行处理的数据使用务器进行处理的数据使用 MIME 编码类型。编码类型。（5）将光标插入到表单内，输入标识提示文字）将光标插入到表单内，输入标识提示文字“您的姓名：您的姓名：”。（6）单击）单击【表单表单】选项中的选项中的【文本字段文本字段】按钮按钮 ，就会在表单中生成一个，就会在表单中生成一个【文本字段文本字段】表单域，如表单域，如图所示。图所示。第四十一页，讲稿共七十页哦创建表单文本字段示意图创建表单文本字段示意图第四十二页，讲稿共七十页哦1.创建表单的创建表单的单选按钮单选按钮网页中表单的单选按钮一般都是成组出现的，在页网页中表单的单选按钮一般都是成组出现的，在页面设计时既要为单选按钮组定义一个标识，也要为面设计时既要为单选按钮组定义一个标识，也要为每一个单选按钮定义一个标识。创建单选按钮的操每一个单选按钮定义一个标识。创建单选按钮的操作步骤如下：作步骤如下：（1）在表单的合适位置插入光标，并输入）在表单的合适位置插入光标，并输入单选按单选按钮组钮组的的标识文字标识文字，例如，例如“性别：性别：”。（2）然后单击）然后单击【表单表单】选项中的按钮选项中的按钮 ，并输入，并输入这个这个单选按钮单选按钮的标识文字，例如的标识文字，例如“男男”。建立表单的单选按钮和复选框建立表单的单选按钮和复选框第四十三页，讲稿共七十页哦（3）选中这个单选按钮，打开单选按钮的）选中这个单选按钮，打开单选按钮的【属性属性】面板，如图所示。面板，如图所示。(4)在在【单选按钮单选按钮】文本框中输入单选按钮的名字文本框中输入单选按钮的名字“性别性别”。并在。并在【选定值选定值】文本框中给单选按钮赋值文本框中给单选按钮赋值“男男”。单选按钮的【属性】面板单选按钮的【属性】面板第四十四页，讲稿共七十页哦(5)并为这个单选按钮设置初始状态，并为这个单选按钮设置初始状态，【初始状态初始状态】为为【已勾选已勾选】状态。状态。(6)用同样的方法添加另一个标识为用同样的方法添加另一个标识为“女女”的单选按的单选按钮。钮。(7)在在【单选按钮单选按钮】文本框中输入单选按钮的名字文本框中输入单选按钮的名字“性别性别”。并在选定值文本框中给单选按钮赋值。并在选定值文本框中给单选按钮赋值“女女”。(8)并为这个单选按钮设置初始状态，并为这个单选按钮设置初始状态，【初始状态初始状态】为为【未选中未选中】状态，如图所示。状态，如图所示。表单的单选按钮第四十五页，讲稿共七十页哦2.创建表单的复选框创建表单的复选框网页表单中的复选框可以单个出现也可以成组出现，网页表单中的复选框可以单个出现也可以成组出现，单个复选框可用于答案为是或否的问题，成组的复单个复选框可用于答案为是或否的问题，成组的复选框可用于一个或多个选项选取的问题。选框可用于一个或多个选项选取的问题。一般情况一般情况下，复选框组的标识文字放在复选框之前，而每一下，复选框组的标识文字放在复选框之前，而每一个复选框的标识文字放到复选框的后面。个复选框的标识文字放到复选框的后面。第四十六页，讲稿共七十页哦下面将介绍创建复选框的过程，其操作步骤如下。下面将介绍创建复选框的过程，其操作步骤如下。(1)在表单的合适位置插入光标，并在表单的合适位置插入光标，并输入复选框组输入复选框组的标识文字的标识文字，例如，例如“您经常关注本网上书店的哪些您经常关注本网上书店的哪些栏目？栏目？”。(2)将光标插入到合适的位置，然后单击将光标插入到合适的位置，然后单击【表单表单】选项中的按钮选项中的按钮 ，并输入这个单选按钮的标识文字，并输入这个单选按钮的标识文字，如图所示。如图所示。表单的复选框第四十七页，讲稿共七十页哦选中该复选框，在复选框的选中该复选框，在复选框的【属性属性】面板中为其设面板中为其设置名称和赋值，如图置名称和赋值，如图8-7所示。所示。【属性属性】面板中各项参数意义如下所述。面板中各项参数意义如下所述。在在【复选框名称复选框名称】文本框中，给选中的复选框起一文本框中，给选中的复选框起一个名字，也就是选中该复选框后向服务器发送信息个名字，也就是选中该复选框后向服务器发送信息时所用的变量名。时所用的变量名。在在【选定值选定值】文本框中，输入选中该复选框后要向文本框中，输入选中该复选框后要向服务器发送的内容服务器发送的内容在在【初始状态初始状态】中，选中中，选中【已勾选已勾选】单选项表示该单选项表示该复选框初始状态已被选中。选中复选框初始状态已被选中。选中【未选中未选中】单选项单选项表示该复选框初始状态为待选状态。表示该复选框初始状态为待选状态。复选框复选框【属性属性】面板设置的参数应按照与服务器端面板设置的参数应按照与服务器端程序的约定来完成。程序的约定来完成。第四十八页，讲稿共七十页哦图图8-7表单复选框的【属性】面板表单复选框的【属性】面板第四十九页，讲稿共七十页哦给表单添加给表单添加列表框与下拉式列表框列表框与下拉式列表框的方法基本相同，的方法基本相同，只需在创建了空白列表后，在列表只需在创建了空白列表后，在列表【属性属性】面板的面板的【类型类型】中选择不同的单选项便可完成设置。选择中选择不同的单选项便可完成设置。选择【菜单菜单】单选项，可创建下拉式列表框；选择单选项，可创建下拉式列表框；选择【列列表表】单选项，可创建列表框。单选项，可创建列表框。下面来介绍创建表单的列表框方法。下面来介绍创建表单的列表框方法。（1）在表单的合适位置上插入光标，然后输入下）在表单的合适位置上插入光标，然后输入下拉式列表的框的标识文字，例如拉式列表的框的标识文字，例如“您的职业：您的职业：”。（2）单击）单击【表单表单】选项中的按钮选项中的按钮 ，此时表单的，此时表单的光标位置上显示一个很小的下拉式列表框。光标位置上显示一个很小的下拉式列表框。8.2.3 创建表单的列表框创建表单的列表框第五十页，讲稿共七十页哦（3）选中新建的下拉式列表框，下拉列表框的）选中新建的下拉式列表框，下拉列表框的【属性属性】面板，如图面板，如图8-8所示。所示。图图8-8下拉式列表框的【属性】面板下拉式列表框的【属性】面板第五十一页，讲稿共七十页哦【属性属性】面板中各项参数的意义如下。面板中各项参数的意义如下。在在【列表列表/菜单菜单】文本框中设置下拉式列表框的名称。在此文本框中文本框中设置下拉式列表框的名称。在此文本框中输入下拉式列表框的名称为输入下拉式列表框的名称为select。在在【类型类型】选项区中设置下拉式列表框的类型为选项区中设置下拉式列表框的类型为【菜单菜单】。若下拉式列表框的若下拉式列表框的【类型类型】设置为设置为【列表列表】时，高度文本框被激活，时，高度文本框被激活，在其中可设置该列表框可显示的行数。在其中可设置该列表框可显示的行数。选中选中【选定范围选定范围】复选框，可将下拉式列表设置成一次选择多复选框，可将下拉式列表设置成一次选择多个选项。可以通过按个选项。可以通过按Ctrl键，再单击选择不相邻的任意多个选键，再单击选择不相邻的任意多个选项，也可以通过按项，也可以通过按Shift键来选中两次单击选项之间所有连续的选项。键来选中两次单击选项之间所有连续的选项。单击单击【列表值列表值】按钮，可以进行列表值的设置。按钮，可以进行列表值的设置。在在【初始化时选定初始化时选定】列表中，会显示通过列表值设置的列表项目文列表中，会显示通过列表值设置的列表项目文字。字。第五十二页，讲稿共七十页哦（4）在）在【属性属性】面板中单击面板中单击【列表值列表值】按钮，打按钮，打开开【列表值列表值】对话框，如图对话框，如图8-9所示。所示。（5）单击项目标签按钮的下方，在出现的文本框）单击项目标签按钮的下方，在出现的文本框中输入中输入“工人工人”。（6）按按Tab 键或单击值按钮键或单击值按钮，在出现的文本框中，在出现的文本框中输入选项的赋值输入选项的赋值“GR”。（7）单击）单击 按钮，重复步骤（按钮，重复步骤（5）、（）、（6）添加新）添加新的列表选项。的列表选项。第五十三页，讲稿共七十页哦图8-9【