基础课程 PPT 第12章 表单.ppt

12.2表单的创建 12.2.2 插入表单对象 8.按钮 对于HTML表单，按钮是必不可少的，使用表单按钮可以将表单中的数据提交到服务器上，在服务器上可以看到用户提交的内容，从而完成客户端与服务器之间的交互。其操作步骤如下。 光标移动到表单内，执行“插入”|“表单”|“按钮”命令，或单击表单面板中“按钮”按钮 ，即在表单中插入了“按钮”对象，单击“按钮”对象，在属性面板中设置按钮的属性，如图所示。 12.2表单的创建 12.2.2 插入表单对象 8.按钮 按钮名称：设置按钮名称。 值：设置按钮上显示的文本。 动作：确定单击该按钮时发生的动作。“提交”和“重置”是两个保留名称，“提交”通知表单将表单数据提交给处理应用程序或脚本，而“重置”则将所有表单域重置为其原始值。“无”指定单击该按钮时要执行的动作。 效果如右图所示。 12.2表单的创建 12.2.2 插入表单对象 9.图像域 可以使用图像作为按钮图标。如果使用图像来执行任务而不是提交数据，则需要将某种行为附加到表单对象。其操作步骤如下。 光标移动到表单内，执行“插入”|“表单”|“图像域”命令，或单击表单面板中“图像域”按钮，即在表单中插入了“图像域”对象，单击“图像域”对象，在属性面板中设置图像域的属性，如图所示。 12.2表单的创建 12.2.2 插入表单对象 9.图像域 图像区域：设置按钮名称。 源文件：设置选定图像的路径和文件名。 替换：用于输入描述性文本，一旦图像在浏览器中加载失败，将显示这些文本。 对齐：设置对象的对齐属性。 编辑图像：启动默认的图像编辑器，并打开该图像文件以进行编辑。 12.2表单的创建 12.2.2 插入表单对象 10. 隐藏域 可以使用图像作为按钮图标。如果使用图像来执行任务而不是提交数据，则需要将某种行为附加到表单对象。其操作步骤如下。 光标移动到表单内，执行“插入”|“表单”|“隐藏域”命令，或单击表单面板中“图像域”按钮，即在表单中插入了“隐藏域”对象，单击“隐藏域”对象，在属性面板中设置隐藏域的属性，如图所示。 值：为域指定一个值。该值将在提交表单时传递给服务器。 隐藏域：设置该域的名称。 12.2表单的创建 12.2.3 验证表单 利用Dreamweaver 中“检查表单”的内部行为，可以检查用户在填写表单对象的内容是否合适，当用户在单击提交按钮时，对表单对象行进检查。 检查如图所示表单，具体步骤如下。 12.2表单的创建 12.2.3 验证表单 检查表单，具体步骤如下。 (1) 执行“窗口”|“行为”命令，打开“行为”面板。 (2) 选择该表单，在“行为”面板中单击 按钮，然后从列表中选择“检查表单”行为，弹出“检查表单”对话框，如图所示。 (3) input“user”，值：选择“必需的”复选框，可接受：任何东西。 (4) input“passwords”，值：选择“必需的”复选框，可接受：任何东西。 (5) input“email”， 值：选择“必需的”复选框，可接受：电子邮件地址，单击【确定】按钮。 12.2表单的创建 12.2.3 验证表单 检查表单，具体步骤如下。 (6) 行为面板上事件为OnSubmit，保存网页，按F12键预览。单击“提交”按钮，出现提示，如图所示。 12.3 实例—创建网站留言板 创建如图所示的用户注册页面。 12.3 实例—创建网站留言板 创建如图所示的用户注册页面，具体步骤如下。 (1) 打开Dreamweaver，创建一个空白网页。 (2) 在空白网页上，插入表格。 12.3 实例—创建网站留言板 创建如图所示的用户注册页面，具体步骤如下。 (3) 合并第1行单元格，插入图片为“bbs/images/banner2.jpg”。 (4) 合并第3行单元格，并输入文字“用户注册帮助”。 (5) 光标放置在第5行第1列的单元格中，单元格宽度：157。设置该单元格的背景图像为“bbs/images/beijing2.jpg”。在单元格中插入图片为“bbs/images/kfsw-1.jpg”。 (6) 光标放置在第5行第3列的单元格中，插入图片为“bbs/images/youbiantiao.jpg”。 (7) 合并第6行单元格，单元格背景色为#0099ff，合并第7行单元格，单元格背景色为#dcedf9输入文字，效果如图。 12.3 实例—创建网站留言板 创建如图所示的用户注册页面，具体步骤如下。 (8) 最终效果如图所示。 12.3 实例—创建网站留言板 创建如图所示的用户注册页面，具体步骤如下。 (9) 光标放置在第5行第2列的单元格中，插入表单。 (10)光标放置表单中，