《Web应用开发》课件-10 表单

本章简介：表单的出现已经使网页从单向的信息传递，发展到能够实现与用户交互对话，使网页的交互性越来越强。本章主要讲解表单的使用方法和应用技巧，通过这些内容的学习，可以利用表单输入信息或进行选择，使用包括文本域、密码域、单选按钮/多选按钮、列表框、跳转菜单、按钮等表单对象，将表单相应的信息提交给服务器进行处理。使用表单可以实现网上投票、网站注册、信息发布、网上交易等功能。10表单的使用课堂学习目标掌握创建表单的方法掌握设置表单属性的方法掌握创建列表和菜单的方法掌握创建跳转菜单的方法掌握创建文本域和图像域的方法掌握创建按钮的方法10.1表单的使用创建表单表单的属性单行文本域课堂案例—用户登录界面单选按钮单选按钮组复选框课堂案例—人力资源网页创建列表和菜单创建跳转菜单创建图像域创建文件域创建按钮10.1.1创建表单在文档中插入表单的具体操作步骤如下。（1）在文档窗口中，将插入点放在希望插入表单的位置。（2）弹出“表单”命令，文档窗口中出现一个红色的虚轮廓线用来指示表单区域。创建表单10.1.2表单的属性在文档窗口中选择表单，“属性”面板中出现表单属性。“属性”面板10.1.3单行文本域1．插入单行文本域单行文本域通常提供单字或短语响应，如姓名或地址。2．插入密码文本域密码域是特殊类型的文本域。当用户在密域中输入时，所输入的文本被替为星号或项目符号，以隐藏该文本，保护这些信息不被看到。3．插入多行文本域多行文本域为访问者提供一个较大的区域，供其输入响应。可以指定访问者最多输入的行数以及对象的字符宽度。如果输入的文本超过这些设置，则该域将按照换行属性中指定的设置进行滚动。10.1.3单行文本域10.1.4课堂案例—用户登录界面使用“表单”按钮，插入表单；使用“表格”按钮，插入表格；使用“文本字段”按钮，插入文本字段；使用“属性”面板设置表格、文本字段的属性。效果图10.1.5复选框插入复选框有以下几种方法。单击“插入”面板“表单”选项卡中的“复选框”按钮，在文档窗口的表单中出现一个复选框。选择“插入>表单>复选框”命令，在文档窗口的表单中出现一个复选框。10.1.6单选按钮插入单选按钮有以下几种方法。单击“插入”面板“表单”选项卡中的“单选按钮”按钮，在文档窗口的表单中出现一个单选按钮。选择“插入>表单>单选按钮”命令，在文档窗口的表单中出现一个单选按钮。10.1.7单选按钮组先将光标放在表单轮廓内需要插入单选按钮组的位置，然后启用“单选按钮组”对话框。弹出“单选按钮组”对话框有以下几种方法。单击“插入”面板中“表单”选项卡的“单选按钮组”按钮。选择“插入>表单>单选按钮组”命令。10.1.8课堂案例—人力资源网页使用“单选按钮”按钮，插入单选按钮；使用“复选框”按钮，插入复选框。效果图10.1.9创建列表和菜单1．插入下拉菜单插入下拉菜单有以下几种方法。单击“插入”面板“表单”选项卡中的“列表/菜单”按钮，在文档窗口的表单中出现下拉菜单。选择“插入>表单>列表/菜单”命令，在文档窗口的表单中会出现下拉菜单。2．插入滚动列表若要在表单域中插入滚动列表，先将光标放在表单轮廓内需要插入滚动列表的位置，然后插入滚动列表。插入滚动列表有以下几种方法。单击“插入”面板“表单”选项卡的“列表/菜单”按钮，在文档窗口的表单中出现滚动列表。选择“插入>表单>列表/菜单”命令，在文档窗口的表单中出现滚动列表。10.1.10创建跳转菜单在网页中插入跳转菜单的具体操作步骤如下。（1）将光标放在表单轮廓内需要插入跳转菜单的位置。（2）选择“插入跳转菜单”命令，弹出“插入跳转菜单”对话框，启用“插入跳转菜单”对话框有以下几种方法。在“插入”面板“表单”选项卡中单击“跳转菜单”按钮。选择“插入>表单>跳转菜单”命令。10.1.11创建图像域弹出“选择图像源文件”对话框有以下几种方法。单击“插入”面板“表单”选项卡中的“图像域”按钮。选择“插入>表单>图像域”命令。10.1.12创建文件域插入文件域有以下几种方法。将光标置于单元格中，单击“插入”面板“表单”选项卡中的“文件域”按钮，在文档窗口中的单元格中出现一个文件域。选择“插入>表单>文件域”命令，在文档窗口的表单中出现一个文件域。10.1.13创建按钮插入按钮有以下几种方法。单击“插入”面板“表单”选项卡中的“按钮”按钮，在文档窗口的表单中出现一个按钮。选择“插入>表单>按钮”命令，在文档窗口的表单中出现一个按钮。课堂练习—智能扫地机器人网页使用“文本字段”按钮，制作用户名、手机、密码和验证