如何运用插件绘制HTML地新闻系统

相关推荐

如何运用插件绘制HTML地新闻系统

　　出于对Dreamweaver 8 的喜爱，我对Dreamweaver 8 做了一些研究。同时也用Dreamweaver 8作为封装平台给Dreamweaver 8封装了许多服务器行为的功能扩展插件，当然也封装了一些命令、行为和对象插件。这些插件大家可以去我的插件发布页下载使用。

　　今天我要教大家的是如何利用Dreamweaver 8加上我制作的插件来实现一个简单的生成HTML的新闻系统。例子是简单的，但是原理和方法是一致的，学会了使用这个插件的功能，可以将这个插件应用到许多大的新闻和文章系统当中去。至于数据生成HTML有什么好处，我相信在这里不需要做说明，大家也能理解和明白。

　　下面我们就开始来利用Dreamweaver 8加插件来制作这个系统，首先我们建立一个数据库和设计一个新闻数据表。如下图：

　　我们建立一个名为“data.mdb”的数据库。并且在数据库中设计一个名为“news”的数据表用来存储新闻数据。具体字段设计你可以参照上图设计。

　　数据库建立设计好后我们先来分析一下一个简单的生成HTML的新闻系统需要有什么样的流程。注意：设计任何形式的系统之前分析系统的功能和流程这一步是非常重要的。事先分析好了流程，能让你的整个系统条理清晰，能让你在设计系统的时候有计划有目的的去实现系统的功能。

　　我们发现一个简单的生成HTML的新闻系统至少需要4个文件。首先是名为“index.ASP”的现实新闻列表的首页，然后是名为“add.ASP”的新闻发布表单页，再者是名为“setup.ASP”的生成HTML新闻的功能页。最后是名为“templates.HTML”的新闻模板页，这个页面你可以随意设计只需要在现实数据的地方镶嵌上数据显示的标签即可。比如在要显示标题的地方镶嵌上 “@标题@”这样的标签即可。非常的简单和便利。

　　从上面的分析我们可以看出一个最基本的系统构架。其每个页面所必须具备的功能也就很容易理解。

　　下面我们开发着手制作这个系统。

　　首先我们打开Dreamweaver 8 新建一个站点。

　　然后设置站点所需要的编程语言：

　　站点建立成功后，我们要开始建立站点的数据库连接。

　　为了设置使用方便，我们使用绝对路径连接数据库。具体实例连接代码如下：

　　"Driver={Microsoft Access Driver (*.mdb)};Dbq=E:SHOPdata.mdb;"

　　你可以按照你数据库存放的绝对路径对连接字符串中的路径进行更改。

　　数据库连接成功后，我们开始制作系统的第一个页面：发布新闻页面“add.ASP”。首先请先新建一个名为“add.ASP”的页面。然后打开页面选择应用程序面板。选择插入表单向导按钮。

　　根据图示你设置好你要插入的字段名成和完成插入后所要前往的页面。这里提醒一下菜鸟读者，自动编号字段和时间日期字段时不要要进行插入操作的，这类型的字段都会在插入操作的同时在数据库中自行完成新增动作。所以在表单字段框中，你可以删除这两个字段的插入操作。

　　当然为了防止用户提交空数据到数据库中，我们可以为该表单加入验证输入的行为。鉴于Dreamweaver 8 自带的表单验证行为功能薄弱，而且不能自己定义出错提示，我们这里将用到本系统第一个用到的插件“高级表单验证”。如果你安装了这个插件可以用常用面板中找到这个插件。

　　利用这个表单验证的插件设置好表单提交数据的条件。最后按下确定按钮，那么整个“add.ASP”页面的所有功能就制作完成。我们按下保存按钮来保存所有的操作，然后关闭这个页面。

　　第二步，我们开始制作名为“setup.ASP”的生成HTML的功能页面。整个页面需要进行2个操作，一个是建立记录集，另一个是加入插件功能。好那我们就开始制作整个页面。

　　首先，我们新建立一个文件名为“setup.ASP”,打开这个新建立的文件。首先我们在这个文件中建立一个行新闻表“news” 的记录集。如图：

　　设置好记录集后按下确定按钮。

　　注意：接下来我们要对记录集做一个关键而重要的设定。由于我们使用的是ACCESS作为数据库，所有我们在加入生成HTML的插件操作之前需要把记录集的光标类型进行更改。首先请点应用程序面板的服务器行为，如图：

　　然后你将看到记录集的属性面板。

　　你将看到记录集的默认光标类型是“仅向前”，我们就是要讲光标类型进行更改，将光标类型改为“键集”。如图所示

　　注意：只有使用ACCESS数据库是才需要做这样的更改操作，假如你使用SQL作为数据库，那么这个步骤可以省略。

　　设定好记录集后，我们马上要加入整个系统最激动人心和最重要的一项功能，那就是生成HTML的功能。首先你点击服务器行为面板，单击上面的加号。在出现的菜单中选择“落魄小生插件集”再选择插件集里的“生成HTML文件”的功能。如图：

　　下一步将出现插件的设置对话框。如图：

　　在这个你可以设置生成HTML所必须的条件，比如标题字段、文件名字段、HTML存放的文件夹等资料。设置完成后按下确定。那么至此整个生成HTML文件的功能页面就算制作完成了。我们按下保存，然后关闭整个页面。

　　第三步我们将制作名为“index.ASP”的现实新闻列表的首页。这个页面将会需要建立一个数据集，设置数据的现实重复区域，以及加入翻页的功能。

　　那么我们接下来就开始制作这个页面，首先先新建一个名为“index.ASP”的文件，然后打开这个文件。在这个文件中插入一个2行1列的表格。如下表格效果：

　　[编号字段]:[标题字段][分页程序内容]

　　第一行将现实新闻的编号和标题，第二行将放置分页的代码。

　　建立好了表格我们就将建立一个记录集。如图所示：

　　注意：为了在最前面现实最新发布的新闻，请将记录集的排序设置条件。这里我们设置字段“id”的排序为降序，也就是最后发布的新闻将现实在最前面。

　　设置好记录集后，按下确定按钮。然后我们把需要显示的字段拖放绑定在页面相应的地方。如图：

　　为了让标题连接到相应的HTML新闻，我们还要对标题字段设置相应的连接：选中标题字段，然后再属性面板设置其连接。如图：

　　点箭头所指的图标，将出现连接设置对话框。如图：

　　这样就制作好了新闻的连接。

　　[首页][][末页]

　　选择页数

　　接下来我们要让每页显示10条新闻，实现整个功能我们需要用到服务器行为“重复区域”。我们选中表格行的“TR”标签，点选服务器行为的“重复区域”功能，将出现如下对话框：

　　按下确定就完成了重复区域的设置。设置完后的效果如下图所示：

　　加入新闻不只10条呢？那我们该如何显示所有的新闻呢？这里我们就需要用到翻页的功能。Dreamweaver 8 本身自带了分页的功能行为，但是其功能过于弱小，往往难以满足程序开发和现实的需要。那么有没有办法让Dreamweaver 8 具备像高手手写代码那样的分页功能呢？答案是肯定的，当然可以，我们可以通过我开发的插件来完成整个分页的功能。如下图：

　　点击该功能将会出现一个设置对话框。如图：

　　按下确定按钮，完成后的效果图如下：

　　至此，整个新闻显示页面就制作完毕，保存关闭后，我们将来测试整个新闻系统的功能。

　　[NextPage]

　　以上步骤，让我们制作完成了整个系统，接下来我们就来测试一下这个系统。

　　因为数据库中还没有数据，那么我们首先在打开“add.ASP”文件按下F12在浏览器中浏览执行该文件。如图：

　　我们填写相关新闻后按下添加新闻按钮。添加完成后系统将自动前往HTML生成页“setup.ASP”生成新闻。如图：

　　从图中我们看到数据已经成功生成了HTML文件。

　　我们再返回察看新闻列表.如图：

　　我们发现这个系统的新闻以及现实出来，我们随便点击一条新闻,都将连接到相应的HTML文件。如图：

　　写道此整个系统就完成了，希望大家能喜欢我的教程，我将在后续文章中陆续推出Dreamweaver 8 加插件，进行高级程序开发的系列教程，希望大家密切关注。

【如何运用插件绘制HTML地新闻系统】相关文章：