实例Dreamweaver_制作表单页

Dreamweaver中如何创建表单和处理数据Dreamweaver是一种功能强大的网页开发工具，它提供了简便的界面和丰富的功能来创建网页。

在网页设计中，表单是一项重要的功能，可以让用户与网页进行交互，并收集用户提交的数据。

本文将介绍如何在Dreamweaver中创建表单，以及如何处理表单提交的数据。

第一章：创建表单Dreamweaver提供了简单的方式来创建表单。

首先，在Dreamweaver的工具栏上找到“表单”工具，点击它，然后在页面上拖动鼠标来创建一个表单区域。

接下来，通过在表单区域上点击右键，选择“插入表单元素”来添加各种表单元素，如文本框、下拉列表、复选框等。

在添加元素时，可以设置它们的属性，如名称、类型、默认值等。

第二章：表单验证表单验证是确保用户输入的数据符合预期格式和要求的重要步骤。

Dreamweaver提供了多种验证方法。

例如，可以使用Dreamweaver提供的预设验证规则，如必填字段、电子邮件格式验证等。

也可以自定义验证规则，通过正则表达式来验证输入的数据。

通过选择表单元素，然后在属性面板中选择“验证”选项，可以简单地配置表单验证。

第三章：表单布局好的表单布局可以提升用户体验，并使表单更易于阅读和填写。

Dreamweaver提供了多种布局选项。

可以使用表格布局，将表单元素放入表格单元格中。

也可以使用CSS布局，通过设置样式来控制表单元素的排列方式。

此外，Dreamweaver还提供了对响应式设计的支持，可以根据设备的屏幕尺寸来调整表单的布局。

第四章：处理表单提交数据当用户填写完表单并点击提交按钮时，需要将表单提交的数据发送到服务器进行处理。

在Dreamweaver中，可以使用服务器端脚本语言（如PHP、等）来处理表单数据。

首先，在服务器上创建一个接收数据的脚本文件，例如“process.php”。

然后，在表单的“动作”属性中设置为指向该脚本文件的URL。

这样，当用户提交表单时，表单数据将被发送到服务器上的脚本文件进行处理。

《Dreamweaver制作表单》教学设计作者：王丽莉来源：《黑河教育》2013年第07期教材分析《Dreamweaver制作表单》是中等职业制作网页的方法及过程专业教材《网页设计与制作》中第七章的内容。

在网页设计中，表单是一个专业网站必不可少的内容，是网站管理者与浏览者之间沟通的桥梁。

通过表单可以得到访问者的反馈信息，收集用户的反馈意见，在此基础上做出科学合理的决策。

本章内容主要涉及表单概述、创建表单、表单元素的插入及表单参数设置操作，其中创建表单页面是学习的主要内容。

学情分析职高学生喜欢亲自动手操作，但缺乏系统的分析能力，缺少从实践到理论的总结能力，因此本课教学要注重培养学生的协作讨论和分析问题能力。

教学目标知识与技能：理解表单的概念和作用；了解规划表单、创建表单与设置表单的方法；能使用“Dreamweaver”制作表单网页。

过程与方法：采用知识迁移，对比引入；开展任务驱动，学习新知；进行问题探究，突破难点，巩固所学。

情感态度与价值观：培养学生网页设计的审美能力、创新能力、协作学习和自主学习能力。

教学重难点重点：创建表单。

难点：表单元素的插入。

教学过程一、创设情境，导入新课教师利用大屏幕展示生活中常见的各种表单页面，让学生一边欣赏一边思考：这些常见的页面能实现什么功能？在网页设计中怎样实现这些功能？以此激发学生的学习兴趣，导入本节学习内容——制作表单页面。

【设计意图】这一环节，通过展示图片，从现象到本质总结出表单在我们生活中的实用性，锻炼了学生的归纳总结能力，激发了学生学习新知的欲望，为后面的学习做了铺垫。

1.表单创建的作用在网页制作中，表单主要作用就是收集来自用户的信息，例如用户名、密码、电子邮箱地址、兴趣、爱好等等，主要完成调查、注册、搜索、订购等功能，它是网站管理者与浏览者之间沟通的桥梁。

让学生举例说明在生活中常见的表单有哪些？2.认识表单元素表单域；文本域；单选按钮；复选框；文件域；提交按钮。

Dreamweaver表单创建与设置
一、表单的创建方法：
点击“插入”-“表单”，如下图所示。

这样表单就插入了，也可以点击“插入栏”-“表单”，如下图所示。

点击“表单”按钮，这样表单也能被创建，效果如下图所示。

二、设置表单的属性
在“属性”面板上，表单的属性如下图所示。

各参数含义如下：
1.表单名称：设置表单的名称，可用于处理程序的调用。

2.动作：指定处理表单的程序。

3.目标：与超链接的目标一样。

4.方法：表单的发送方式有POST和GET两种。

.POST用于发送长字符的表单内容，因此在发送时比GET安全，但是用POST方法发送的信息是未经加密的。

.GET用于发送较短字符的表单内容，若发送的数据量太大，数据将被截断，从而导致意外的或失败的处理结果。

5.MIME类型：是指定对提交给服务器进行处理的数据使用的编码类型。

有pplication/x-www-form-urlencoded和multipart/form-data两种。

实验8 Dreamweaver网页制作
一实验目的
掌握网页制作软件Dreamweaver的基本使用方法。

二、实验内容
设计效果不要求与图示完全一致，可根据自己的喜好调整。

素材利用现的电脑资源。

1. 做一个表单，要求密码在输入时为符号，性别只能选中一个。

其中“重置”、“提交”为二个按钮，功能不需具体实现。

如下图所示。

保存成form1.html.(注：所有的元素都必须在表单内（红色虚线内）)
操作提示：插入表单：插入｜表单
2. 做一个表单设计一个会员注册页面，所有内容放在一个3行1列的表格中，如下图所示。

要求密码在输入时为符号，性别只能选中一个。

其中“重写”、“放弃”、“提交”为三个按钮，功能不需具体实现。

保存成form2.html.(注：所有的元素都必须在表单内（红色虚线内）)，
3.设计如下图所示的网页，插入框架。

“猫咪相册”、“狗狗影集”和“白兔写真”超链接
到具体的内容。

操作提示：（1）插入框架：插入｜html|框架。

（找到合适的框架插入）
（2）框架保存：文件｜保存全部（注：三个区域，四个html文件）
（3）框架里的超链接：选中要超链接的文字，链接到具体的页面（具体的网页页面要自己再创建），链接目标选择mainframe.
交作业时，将本次课程中完成的姓名文件夹压缩（压缩文件名为学号后3位+姓名，如：101张三）后上传到FTP的相应班级文件夹中。

传错位置或文件命名不正确将视为未交作业！！。