使用Dreamweaver编辑制作动态网站.docVIP

使用Dreamweaver编辑制作动态网站 为了让读者实际掌握使用Dreamweaver编辑制作JSP动态网站的基本方法和操作，我们就仿照本章的范例ch1创建、编辑、制作一个小的JSP动态网站。这个站点由一个静态网页和一个动态网页构成。站点名称定为exam，静态网页的文件名定为ex.htm，动态网页的文件名定为ex.jsp。虽然这个站点简单，但我们将完全按照一个正规的站点设计制作过程来完成它。 第一步：创建站点： 创建站点前，需要先启动JSP引擎。这里启动resin2.1.6（注：本教材后面各章的范例，一般都使用resin进行介绍讲解。只在操作上使用tomcat有明显不同时，再进行单独的讲解介绍）。 然后启动Dreamweaver，进入后，单击菜单中“站点”－“管理站点”，出现站点管理的对话框，如图1-25所示： 图1-25 选择“新建”按钮下的“站点”选项，单击后出现站点定义对话框如图1-26所示： 图1-26 选择“高级”标签，转换到高级设置方式。如图1-27所示： 图1-27 先设置本地信息，如图1-28所示：。在“站点名称”文本框，为站点起一个名字exam（可以是任何字母）。在“本地根文件夹”文本框，单击后面的文件夹图标，选择resin2.1.6\doc内的文件夹exam，作为站点文件夹。这个文件夹原来不存在，可以使用新建文件夹工具按钮进行创建，然后再选择它。在“默认图像文件夹”文本框，使用同样的方法创建并选择images文件夹。其他选项可以不进行设置。 特别注意：因为这个站点是JSP动态网站，它所在的物理位置，必须在resin2.1.6\doc文件夹内。如果创建到其他位置，动态网页将不能正常运行。 图1-28 单击对话框左边的“远程信息”，进入远程信息设置界面，如图1-29所示：在“访问”文本框处，选择“本地/网络”，在“远端文件夹”文本框，使用后面的文件夹选择按钮，选择刚刚创建的本地站点文件夹c:\resin2.1.6\doc\exam。 图1-29 单击对话框左边的“测试服务器”，进入测试服务器设置界面，如图1-30所示：在“服务器模型”文本框处，选择“JSP”；在“访问”文本框处，选择“本地/网络”，“测试服务器文件夹”文本框中的内容会自动出现。URL前缀文本框，原有的内容是“ http://localhost ”，现在将它改成为“ http://localhost:8080/exam ”或者改成为“ :8080/exam ”。这里添加的8080是JSP引擎的端口号，/exam是我们刚刚创建的站点文件夹。 注意：如果进行这项设置之前，没有启动resin2.1.6，系统将报告错误信息。 图1-30 站点创建的设置工作至此已经基本完成，单击对话框下面的“确定”按钮，返回“站点管理”对话框，如图1-31所示。单击对话框下面的“完成”按钮，就完成了站点的创建工作 图1-31 创建站点过程中，我们设置 “本地信息”是必须进行的，“远程信息”和“测试服务器”两项不是必须进行设置的内容，但是设置之后，调试程序时能够简捷方便。如果远程信息在互联网上，将能够将编辑好的站点，自动上传到互联网上。 第二步：编辑制作静态网页： 单击Dreamweaver菜单中“文件”－“新建”，出现新建文档对话框，如图1-32所示：选择“基本页”－“HTML”，单击文本框下面的“创建”按钮，即可开始编辑制作所需的网页。 图1-32 我们在页面输入相应的文字，添加一个文本框和一个提交按钮，如图1-33所示： 图1-33 设置文本框的属性，将文本框的名称改为“name”如图1-34所示： 图1-34 设置表单域的属性：用鼠标单击表单域的红色虚线，即可出现表单域的属性面版，将其中的“动作”属性填写上“ex.jsp”。这是我们在提交数据后，处理所提交数据的动态网页文件名。如图1-35所示 图1-35 属性设置完毕，将网页以ex.htm为文件名保存到站点exam文件夹内。 第三步：编辑制作JSP动态网页： 单击Dreamweaver菜单中“文件”－“新建”，出现新建文档对话框，如图1-34所示：选择“动态页”－“JSP”，单击文本框下面的“创建”按钮，即可开始编辑制作所需的动态网页。 图1-34 切换到“代码”编辑模式，可以看到已经生成的部分代码，如图1-35所示，其中第一行的代码如下： %@ page contentType=text/html; charset=gb2312 language=java import=java.sql.* errorPage= % 它是JSP动态网页的页控制命令行。因为在任何JSP动态网页中，都需要有这一行。因此Dreamweaver就自动生成这行代码。 图1-35 如果此时界面的代码行编号没有在出现。可以单击菜单中“查看”