第IV章、表单

第二篇：Dreamweaver

　

　　在我们通往成功的路上，可能会有恶劣的天气，泥泞的路，但也会有美丽的花园，让你迷恋其中，有时候不见得恶劣环境会迟缓你的进程，美丽的花园也可能会把你引向歧路，始终不要忘记我们前进的方向……

【本章要点】

　　１、了解表单组成及控件。
　　２、利用表单完成诸如留言本、登录窗口以及相关应用。

第IV章、表单

　　如果你是第一次学习Dreamweaver，那么表单这个概念可能有点陌生，但实际上你早就见多了，比如网站上的留言本、调查等，都是表单的具体应用。而基于B/S模式的软件开发，表单更是必不可少。

　　例如：http://www.woshicainiao.net/no2/pipeoa/projadd.htm　这就是一个典型的表单。

　　一个表单有三个基本组成部分：

　　表单标签：这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。

　　表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。

　　表单按钮：包括提交按钮、复位按钮和一般按钮。

第一节、制作留言本

　　我们目标是制作一个如下所示的留言本，我们分解为三步。

　　-------------------------------------留言本-----------------------------------------

　　标　题：
　　留言人：
　　内　容：

　　　　　　

　　-------------------------------------------------------------------------------------

　　１、第一步，选择菜单“插入>表单>文本域（T）”。

　　

　　在下面弹出框中，我们暂进选择“否”，等以后学到代码我们再来详细了解表单。

　　

　　标　题：
　　留言人：
　　这样，我们便生成了标题与留言人。

　　２、第二步，选择菜单“插入>表单>文本区域（A）”。

　　

　　内　容：

　　这样便生成了留言内容。

　　３、第三步，选择菜单“插入>表单>按钮（B）”。。

　　

　　

　　这样便生成了提交按钮。

　　我们发现制作一个留言本是非常容易的，我们下面继续学习更多的表单域。

第二节、了解更多表单域

　　本节我们再尝试学习常用的表单域或称控件，以便可以做出我们任何想要的东西。

　　１、选择菜单“插入>表单>复选框（C）”。

　　 同意以上协议。

　　注：复选框可以用于譬如爱好、多选题等多选多的场合。

　　２、 选择菜单“插入>表单>单选按钮（R）”。

　　 男　 女

　　注：单选按钮可以用于譬如单选题等多选一的场合。

　　３ 、 选择菜单“插入>表单>选择选择（列表/菜单）（S）”。

　　 省份：

　　点取选中上面控件，然后点击属性栏的“列表值”。

　　

　　从“列表值”弹出框中点击“+”号，添加选项。例如“河南省”、“河北省”。

　　

　　省份： 河南省河北省

　　注：列表框功能类似单选按钮，可以用于譬如省份、民族、学历等多选一的场合。

　　４ 、 选择菜单“插入>表单>文件（F）”。

　　 照片：

　　注：文件域功能可以用于上传照片、附件或者其它类型的文件的场合。

　　５、 选择菜单“插入>菜单>图像域（I）”。

　　

　　注：图像域功能可以用于制作漂亮的按钮。

　　另外：还有隐藏域、跳转菜单等控件，我们可以先不管它，利用上面所学，我们基本上可以实现绝大多数功能。

第三节、登录

　　我们目标是制作一个登录窗口，我们知道区别在于（１）密码框应该用星号显示，（２）提交改为登录。

　　-------------------------------------登录窗口--------------------------------------

　　用户名：
　　密　码：

　　　　　　

　　-------------------------------------------------------------------------------------

　　１、第一步，参照留言本，我们可以很快完成结果如下：

　　用户名：
　　密　码：

　　　　　　

　　２、第二步，点击密码后面的文本框，从属性栏选择“密码”：

　　

　　然后选择“提交”按钮的文本，值（V）后“提交”修改为“登录”。

　　

　　用户名：
　　密　码：

　　　　　　

　　特别提醒：在我们后面学习的ASP.NET中，会有另外一套截然不同的控件取代目前所学的所有控件，那么我们现在学习这些，是否多此一举呢？虽然ASP.NET不用，但是如果你哪天学习PHP、JSP等，这些控件则完全适用。

【本章任务】

　　任务编号：dw-004

　　以下表单是我们学习的“阡陌纵横—客户关系管理系统”中添加客户信息页面，请你利用所学知识试完成，并保存为dw-004.html。使用cuteftp工具上传至www.woshicainiao.net，并且能够通过http://www.woshicainiao.net/renwu/yourname/dw-004.html访问。