中小型网站建设及网络搭建项目三课件.ppt

《中小型网站建设及网络搭建项目三课件.ppt》由会员分享，可在线阅读，更多相关《中小型网站建设及网络搭建项目三课件.ppt（340页珍藏版）》请在三一办公上搜索。

1、中小型网站建设及网络搭建（上册）,项目三 设计网站动态页面,培 养 目 标,1掌握Internet信息服务（IIS）的安装及配置方法。2理解记录集的概念和使用。3理解并掌握服务器行为。4理解后台管理模块的作用。5理解表单在数据提交中的作用。,1能够搭建ASP动态网站的运行环境。2能够完成网站前台模块的制作。3完成后台管理中各模块的设计制作。4能够正确使用服务器行为解决实际问题。5培养学生解决问题的能力。,实训内容,任务三 设计新闻发布模块,任务四 设计留言板模块,任务五 设计投票调查模块,任务六 设计后台管理模块,任务二 设计注册登录模块,任务一 搭建ASP动态网站运行环境,任务一 搭建ASP

2、动态网站运行环境,情 境 导 入,在李诗同学接到为某学校制作网站的任务中，该网站不仅包括静态页面的制作，也包括用户注册登录、留言板、新闻发布以及后台管理等动态页面的制作。在前面的“项目一 网站静态页面设计”中我们已经和李诗同学一起完成了网站的静态部分的制作，现在让我们和李诗同学一起继续完成网站的动态部分的制作吧。,任 务 要 求,1掌握Internet信息服务（IIS）的安装方法。2掌握配置Internet信息服务（IIS）的基本方法。3掌握在Dreamweaver CS4中指定ASP服务器技术。4理解配置IIS中常用选项卡如主目录、文档的作用。,任务一 搭建ASP动态网站运行环境,任 务 分

3、 析,“搭建ASP动态网站运行环境”主要包括以下内容：IIS的安装、IIS的配置、建立虚拟目录和网站框架搭建。 1IIS安装：在安装之前，先要准备好Windows XP安装光盘或IIS5.1安装包。 2IIS配置：主要包括设置网站主目录、默认文档等。 3在Dreamweaver CS4中指定ASP服务器技术。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务1 安装IIS,任务一 搭建ASP动态网站运行环境,第一步 打开“添加/删除Windows组件”在“开始”菜单中，选择“设置”“控制面板”，在“控制面板”中双击“添加/删除程序”，然后选择“添加/删除Windows组件”。,任 务

4、操 作子任务1 安装IIS,任务一 搭建ASP动态网站运行环境,第二步 在组件前面添加选择标记在弹出的“Windows组件向导”对话框中，在“Internet信息服务（IIS）”组件前面方框加选择标记“”，如图 所示。还可以单击“详细信息”按钮，打开对话框，选择需要安装的Windows组件，如图 所示。,任 务 操 作子任务1 安装IIS,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务1 安装IIS,任务一 搭建ASP动态网站运行环境,第三步 弹出“所需文件”对话框单击“下一步”按钮，出现配置组件安装进度条，并弹出“所需文件”对话框。如图 所示。,任 务 操 作子任务1 安装IIS,

5、任务一 搭建ASP动态网站运行环境,第四步 选择“IIS”安装包的路径单击“浏览”按钮，选择“IIS”安装包的路径。如果光驱中有“Windows安装光盘”则无需选择。,任务一 搭建ASP动态网站运行环境,第五步 安装完成单击“确定”按钮，完成IIS安装。第六步 安装是否成功安装完成后，打开浏览器，在地址栏中输入http:/127.0.0.1或者http:/localhost，如果出现欢迎页面，则说明安装成功。,任 务 操 作子任务1 安装IIS,任务一 搭建ASP动态网站运行环境,任 务 总 结子任务1 安装IIS,默认状态下，IIS会被安装到C:Inetpub目录下，其中有一个名为wwwro

6、ot的文件夹，它是浏览访问的默认目录。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第一步 打开“管理工具”对话框在“开始”菜单中，选择“设置”“控制面板”，在“控制面板”中双击“管理工具”，打开“管理工具”窗口。如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第二步 启动IIS在“管理工具”对话框中，双击“Internet信息服务”图标，启动IIS。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第三步 打开默认网站在左侧服务器列表中单击目录树前的“+”，展开目录“本地计算机”“网站”“默认网站”，如

7、图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第四步 打开“默认网站 属性”对话框右击“默认网站”，从弹出的快捷菜单中选择“属性”，打开“默认网站 属性”对话框，如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第五步 设置“主目录”选择“主目录”选项卡，单击“浏览”按钮，设置“D:zjzx”为主目录，然后单击“确定”按钮，该目录将成为网站的主目录。如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第六步 设置“默认文档”选择“文档”选项卡，单击“添加”按钮，在弹出的“添加默认文档”对

8、话框中，设置默认文档名为“index.asp”，如图 所示。然后单击“确定”按钮。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务2 配置IIS,第七步 调整默认文档顺序选择“index.asp”，选择向上箭头，将“index.asp”调整为第一个默认文档。单击“应用”按钮，完成默认文档顺序的调整。然后，单击“确定”按钮。,任务一 搭建ASP动态网站运行环境,任 务 总 结 子任务2 配置IIS,不同的操作系统下，启动IIS的方法是不同的，上面是Windows XP Professional下启动IIS的方法。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务3 指定服务器技

9、术,第一步 “本地信息”设置（1）打开Dreamweaver CS4，执行“站点”|“管理站点”命令，打开“管理站点”对话框，如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务3 指定服务器技术,（2）在列表框中选中之前建立的站点“zjzx”，单击右侧的“编辑”按钮，打开“zjzx的站点定义为”对话框，选择“高级”选项卡，在“分类”列表框中选择“本地信息”选项，“本地信息”设置如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务3 指定服务器技术,第二步 “测试服务器”设置（1）在“分类”列表框中选择“测试服务器”选项，如图 所示。,任务一 搭建ASP动态

10、网站运行环境,任 务 操 作子任务3 指定服务器技术,（2）单击“服务器模型”右侧的下拉按钮，打开下拉列表，选择合适的服务器模型，这里选择“ASP VBScript”脚本语言。（3）单击“访问”右侧的下拉按钮，打开下拉列表，选择“本地/网络”选项，选择该选项表示在执行动态页面时，将运行本地的Web服务器。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务3 指定服务器技术,（4）在“URL 前缀”文本框中输入站点的位置，因为选择的是本地计算机做为Web服务器，所以可以在“URL 前缀”文本框中输入http:/127.0.0.1或http:/localhost。当创建的动态页面上传到服务

11、器后，在浏览器中不能正常显示时，在IE浏览器的地址栏中输入http:/127.0.0.1或http:/localhost 即可在浏览器中正常显示。设置如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务3 指定服务器技术,（5）设置完成后，单击“确定”按钮，则完成指定服务器技术的操作。,任务一 搭建ASP动态网站运行环境,任 务 总 结子任务3 指定服务器技术,如果使用ASP技术，则Dreamweaver插入VBScript、JavaScript、ASP.NET C#或ASP.NET VB脚本；如果使用JSP技术，则Dreamweaver插入Java脚本。本任务介绍的是在Dr

12、eamweaver CS4中指定ASP服务器技术。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务4 数据库连接,（1）打开Dreamweaver CS4，单击菜单“窗口”“数据库”命令，打开“数据库”面板。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务4 数据库连接,（2）单击“数据库”面板左上角的“+”号按钮，选择“自定义连接字符串”命令，如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务4 数据库连接,（3）打开“自定义连接字符串”对话框，在“连接名称”后的文本框中输入“conn”作为数据库连接的名称，在“连接字符串”后的文本框中输入“Drive

13、r=SQL Server;Server=(local);Database=data;UID=sa;PWD=123”，在“Dreamweaver 应连接”项选择“使用此计算机上的驱动程序”选项。设置如图 所示。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务4 数据库连接,说明：此处UID是指SQL Server的用户名，PWD是指该用户的密码。,任务一 搭建ASP动态网站运行环境,任 务 操 作子任务4 数据库连接,（4）单击右侧的“测试”按钮，如果弹出如图 所示窗口，则说明数据库连接成功。,任 务 总 结,本任务讲解了如何搭建ASP动态网站服务器。重点内容包括IIS安装、IIS配置

14、、指定服务器和数据库连接。本任务是后续章节，如注册登录、留言板、投票、新闻、后台管理的基础。,任务一 搭建ASP动态网站运行环境,参考附录进行实训报告填写。,实 验 报 告,返 回,任务一 搭建ASP动态网站运行环境,任务二 设计注册登录模块,情境导入,注册登录模块是动态网站建设中的基本模块。注册登录模块的作用是用户可以通过首页index.asp的注册按钮进入注册页面，进行新用户注册，注册成功后将返回首页。在首页用户可以进行登录，登录成功后显示欢迎信息，登录不成功则给予提示。,任 务 要 求,任务二 设计注册登录模块,1理解注册登录模块网页结构的整体设计。2掌握用户注册页面的制作。3掌握用户登

15、录功能的实现。,任 务 分 析,任务二 设计注册登录模块,注册登录模块主要包括两个子模块，分别是注册模块和登录模块。注册模块的功能是用户注册，包括将新用户的资料插入到数据库表中、检查表中是否已经包含该用户、注册过程中两次密码是否一致等。登录模块的功能是比较用户在页面上输入的用户名、密码与数据库表中的用户名、密码内容是否一致。主要用到“用户身份验证”中的“登录用户”功能。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第一步 “用户注册登录”版块页面设计1在首页面index.asp导航栏下面一行的左边，插入一个1行3列的表格。2在该表格的第1个单元格中，插

16、入一个表单，在表单中插入一个1行4列的表格。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,3在嵌套表格的第1个单元中，插入图片“images/denglu.gif”；在第2个单元格先输入文本“用户名：”，再插入1个文本框，命名为“users_username”；在第3个单元格先输入文本“密码：”，再插入1个文本框，命名为“users_password”,“类型”设为“密码”；在第4个单元格中插入3个按钮，“登录”按钮的“动作”设为“提交表单”，“重置”按钮的“动作”设为“重设表单”。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二

17、设计注册登录模块,第二步 创建首页面超链接，指向注册页面选中“注册”按钮，单击“行为”面板中单击“+”按钮，选择“转到URL”命令，在“URL”文本框中浏览或输入files/t2/register.asp，如图 所示，单击“确定”按钮。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第三步 创建新用户注册页面利用站点内的模板文件templatesziye.dwt生成一个ASP VBScript动态页，命名为register.asp保存到站点内files文件夹中的t2文件

18、中。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第四步 插入表单打开register.asp页面，单击“插入”“表单”“表单”命令，插入一个表单，表单名为form1。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第五步 在表单中插入表格及表单域将光标定位在表单中，插入一个7行2列的表格，插入文本及各表单元素。五个表单元素的名称如下，其中，两个单选按钮的选定值（Value）分别为：“男”、“女”，“密码”和“确认密码”文本域的“类型”为“密码”。如表 所示。,任 务 操 作子任务1 制 作 新 用 户 注 册

19、页 面,任务二 设计注册登录模块,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,表 表单元素名称设置,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第六步 检查表单单击“窗口”“行为”命令，在“行为”面板中选择“+”按钮，在弹出的下拉菜单中选择“检查表单”命令。设置users_username、users_password、users_password2三个文本域的验证条件为是“值”为“必需的”；“可接受”为“任何东西”，即这三个文本域必须填写，不能为空。users_email文本域的验证条件是“可接受”为“电子邮

20、件地址” 。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第七步 检查两次密码是否一致进入代码窗口，手工修改表单form1中的“确认密码”文本域的onblur事件。当该文本域失去焦点时，会调用check( )函数。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,将光标定位于代码之前，添加代码：,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第八步 插入记录在“服务器行为”面板中，选择“插入记录”命令，弹出“插入记录”对话框，设置有关参数。如图3-2-8所示，然后单击“确定”

21、按钮。图3-2-8 “插入记录”对话框,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第九步 检查新用户名检查新用户名的作用是：如果是已经注册的用户，则不允许再次被注册。在“服务器行为”面板中选择“用户身份验证”，在子菜单中选择“检查新用户”命令。“用户名字段”下拉菜单中选择username字段。“如果已存在，则转到”文本框中输入registerfail.asp。表示如果用户名已经存在，则转到registerfail.asp页面。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第十步 完成注册单击“确定”按钮，完成

22、注册。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,第十一步 建立注册失败页面registerfail.asp如果用户名已经存在，则转到registerfail.asp 页面。效果如图 所示。,任 务 操 作子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,在这个页面中，设置一个“单击这里”超链接，指向注册页面register.asp。如图 所示。图,任 务 总 结子任务1 制 作 新 用 户 注 册 页 面,任务二 设计注册登录模块,本子任务包括用户注册页面设计以及注册成功、注册失败后的处理，编辑工作完成后，将相关的网页保存并上

23、传，就可以测试该注册功能的执行情况了。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第一步 打开首页文件打开首页文件index.asp，将光标置于“登录区域”所在表单中。第二步 打开“登录用户”对话框打开“服务器行为”面板，选择“用户身份验证”“登录用户”命令。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第三步 设置“登录用户”对话框在“登录用户”对话框中有四部分内容，如图 所示。下面详细介绍。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第一部分用来设置表单中的文本域的功能，“

24、从表单获取输入”用来选择设置用户名和密码所在的表单的名称。“用户名字段”是表单中第一个文本域的名称，我们选择users_username。“密码字段”是表单中第二个文本域的名称，我们选择users_password。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第二部分用来设置服务器行为使用到数据源连接的一些参数。“使用连接验证”下拉列表中选择数据源为“conn”。“表格”选择使用到的数据库表users。“用户名列”下拉列表中选择表users中存储用户名的字段users_username。“密码列”下拉列表中选择表users中存储用户密码的字段users_

25、password。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第三部分用来设置用户登录成功或失败时分别转向的页面。如果选中“转到前一个URL（如果它存在）”前的复选框，则登录成功后浏览器会回到浏览index.asp的前一页。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第四部分用来设置用户的浏览权限。选择“用户名和密码”一项，表示只有用户名和密码正确的用户，才能浏览当前网页。选择“用户名、密码和访问级别”一项，表示将根据用户的用户名、密码及权限级别共同决定其浏览网页的权限。从“获取级别自”下拉菜单中选择字段，表示根据

26、该字段的内容来确定用户的权限级别。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第四步 完成“登录用户”设置单击“确定”按钮。在“服务器行为”面板中增加了一个“登录用户”行为。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第五步 读取阶段变量session(“MM_Username”)在创建“登录用户”的服务器行为时，系统将用户名信息保存在阶段变量session(“MM_username”)中，如果在其他页面想使该变量的值，只要读取就可以了。在“绑定”面板中，单击“+”按钮，从弹出的菜单中选择“阶段变量”，在“阶段变量

27、”对话框的名称中输入MM_username，如图3-2-14所示，单击“确定”按钮。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第六步 设置登录成功或失败信息登录成功或失败，都返回index.asp，但显示内容不同。如果登录成功，在首页的“登录区域”显示欢迎界面，如果登录失败，则显示“非法用户”。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,1打开index.asp，在“登录区域”表单中添加一个模块，代码如下： 您好！，欢迎光临！注销

28、注意：Style=display:none表示本span现在不显示。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,2在代码窗口中，找到Response.Redirect(MM_redirectLoginSuccess)和Response.Redirect(MM_redirectLoginFailed)，这是登录成功或登录失败后进行的相应处理。我们进行相应修改。如下：,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,说明：1.login_tab

29、le是“登录区域”所在表格的id。 2.login_table.style.display=none;表示登录成功，将隐藏“登录界面”， login_success.style.display=; 表示显示“欢迎界面”。3.如果登录成功后，隐藏“登录界面”、显示“欢迎界面”，请将控制登录成功或失败的这一大段代码，放到网页最后。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第七步 设置“注销”功能打开index.asp，进入代码视图，选取文字“注销”。在“服务器行为”面板中，选

30、择“用户身份验证”“注销用户”，弹出“注销用户”对话框，如图 所示，单击“确定”按钮。,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,任 务 操 作子任务2 制 作 用 户 登 录 页 面,任务二 设计注册登录模块,第八步 保存文件单击“文件”“保存”命令，将文件保存。,任务二 配置交换机的基本内容,任 务 总 结,用户访问网站时，首先要进行身份验证，这个功能是靠登录页面来实现的。如果输入的用户名和密码与数据库中的已有的用户名和密码一致，则登录成功。如果输入的用户名或密码与数据库中已有的用户名、密码不一样，则登录失败。,任务三设计新闻发布模块,情境导入子任务

31、1 制作新闻发布主页面,新闻发布模块是动态网站建设中最常见的模块。通过对新闻的不断更新，让用户及时了解网站最新信息。在网站首页面的显著位置往往有最新的新闻显示版块。在本网站案例中，我们需要在首页面完成“新闻中心”版块的制作。,任务要求子任务1 制作新闻发布主页面,1掌握查询记录集的创建。2掌握服务器行为“重复区域”、“转到详细页面”的使用。3学会新闻发布时间的显示格式的设置。4学会截取过长的新闻标题。,任务三设计新闻发布模块,实训设备子任务1 制作新闻发布主页面,配置网络环境的计算机系统，安装有IIS、Dreamweaver CS4、SQL Server 2005数据库及动画制作和图像处理等软

32、件。,任务三设计新闻发布模块,任务分析子任务1 制作新闻发布主页面,打开网站首页index.asp，在“新闻中心”位置进行设计，要求显示最新10条新闻信息，显示新闻标题和发布时间等内容，当用户单击想要浏览的新闻标题时即可进入该新闻的详细内容页面；当用户想要浏览更多新闻时，点击该版块右上角的“more”进入新闻列表页面。,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,第一步 插入表格在新闻中心版块位置插入2行2列的表格。第二步 创建查询新闻记录集在“绑定”面板中单击“+”按钮，并从弹出的菜单中选择“记录集（查询）”选项，在打开的“记录集”对话框中输入如表所示的数据，创建一个按新闻

33、发布时间降序排序的查询记录集，如图所示。,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,第三步 绑定记录集字段将相应的记录集字段绑定到表格第2行中单元格的相应位置，如图所示。,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,第四步 设置重复区域1选中表格中第2行，通过单击表格左下方的标记选中该行。2在“服务器行为”面板中单击“+”按钮，从弹出菜单中选择“重复区域”服务器行为。在弹出的“重复区域”对话框中设置显示10条新闻，如图所示。3设置完成后，效果如图所示。,任务三设计新闻发布模块,任务操作子任务1

34、制作新闻发布主页面,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,第五步 在新闻标题上添加“转到详细页面“服务器行为1.选中表格中新闻标题字段代码“Recordset1.news_Title”。2在“服务器行为”面板中单击“+” 按钮，并从弹出菜单中选择“转到详细页面”服务器行为。,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,3在弹出的“转到详细页面”对话框中设置各参数，如图所示。,任务三设计新闻发布模块,任务操作子任务1 制作新闻发布主页面,第六步 给“more”设置链接选中“新闻中心”版块右上角的“more”图片，在“属性”面板中设置链接到文件“files

35、/t3/news.asp”。,任务三设计新闻发布模块,任务总结子任务1 制作新闻发布主页面,1该页面记录集创建时需设置“排序”为news_time降序，这样最新的新闻在版块的最上面显示。2主页面index.asp和新闻详细页面newscontent.asp之间是有关联的，由index.asp页面传递一个参数news_ID给newscontent.asp页面。3当显示的区域有限时，可通过设置日期的显示格式和对新闻标题进行截取来解决。,任务三设计新闻发布模块,情境导入子任务2 制作新闻详细页面,一个网站的新闻信息量是很大的，所以在主页面为了显示更多的新闻，只能列出新闻的标题、日期等，而不显示新闻具

36、体内容。浏览者对哪条新闻感兴趣，可点击该新闻标题的链接后转到详细页面去浏览。,任务三设计新闻发布模块,任务要求子任务2 制作新闻详细页面,1掌握查询记录集的创建。2理解页面间传递的参数news_ID的作用。,任务三设计新闻发布模块,实训设备子任务2 制作新闻详细页面,配置网络环境的计算机系统，安装有IIS、Dreamweaver CS4、SQL Server 2005数据库及动画制作和图像处理等软件。,任务三设计新闻发布模块,任务分析子任务2 制作新闻详细页面,该页面主要是用来显示浏览者单击新闻发布主页面中的新闻标题时打开的详细新闻内容。这个页面设计的重点在于如何接收主页面index.asp所

37、传递的参数，并根据这个参数显示数据库中的相应记录内容。,任务三设计新闻发布模块,任务操作子任务2 制作新闻详细页面,第一步 创建显示新闻详细内容的页面利用站点内的模板文件templatesziye.dwt生成一个ASP VBScript动态页，命名为newscontent.asp保存到站点内files文件夹中的t3文件中。第二步 插入表格在网页相应位置插入一个3行1列的表格。,任务三设计新闻发布模块,任务操作子任务2 制作新闻详细页面,第三步 创建查询新闻记录集在“绑定”面板中单击“+”按钮，并从弹出的菜单中选择“记录集（查询）”选项，在打开的“记录集”对话框中输入如表所示的数据，创建一个设置

38、筛选条件的查询记录集，如图所示。,任务三设计新闻发布模块,任务操作子任务2 制作新闻详细页面,任务三设计新闻发布模块,任务操作子任务2 制作新闻详细页面,第四步 在单元格中绑定记录集字段将记录集字段代码插入到单元格的相应位置，如图所示。,任务三设计新闻发布模块,任务总结子任务2 制作新闻详细页面,该页面在创建记录集时，要设置“筛选”项，通过上个页面传递过来的参数news_ID的值来决定要显示哪条新闻的详细内容。,任务三设计新闻发布模块,情境导入子任务3 制作新闻列表页面,网站为了吸引更多的浏览者，所有的精华都会放置在首页面上显示，多数网站会有最新新闻的显示，但由于版块区域有限，不可能显示网站所

39、有新闻，所以要创建一个新闻的列表页面，以显示更多的新闻信息。,任务三设计新闻发布模块,任务要求子任务3 制作新闻列表页面,1掌握查询记录集的创建。2掌握服务器行为“重复区域”、“转到详细页面”的使用。3会添加“记录集导航条”。,任务三设计新闻发布模块,实训设备子任务3 制作新闻列表页面,配置网络环境的计算机系统，安装有IIS、Dreamweaver CS4、SQL Server 2005数据库及动画制作和图像处理等软件。,任务三设计新闻发布模块,任务分析子任务3 制作新闻列表页面,打开网站首页index.asp，点击“新闻中心”版块右上角的“more”，链接到新闻列表页面，该页面可以显示更多条

40、新闻信息，还可以通过下面的“记录集导航条”实现翻页浏览。每条信息显示新闻标题和发布时间等内容，当用户单击想要浏览的新闻标题时即可进入该新闻的详细内容页面。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第一步 创建新闻列表页面利用站点内的模板文件templatesziye.dwt生成一个ASP VBScript动态页，命名为news.asp保存到站点内files文件夹中的t3文件夹中。第二步 创建查询新闻记录集在网页中相应位置插入一个2行1列的表格。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第三步 创建查询新闻记录集在“绑定”面板中单击“+”按钮，并从弹出的菜

41、单中选择“记录集（查询）”选项，在打开的“记录集”对话框中输入如表所示的数据，创建一个设置筛选条件的查询记录集，如图所示。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第四步 在单元格中绑定记录集字段 将记录集字段代码插入到表格第2行单元格的相应位置，如图所示。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第五步 设置重复区域 1选中表格第2行，通过单击表格左下方的标记选中该行。 2在“服务器行为”面板中单击“+”按钮，并从弹出菜单中选择“重复区域”服务器行为。,任务三设计新闻发布模块,任务操作子任务3

42、 制作新闻列表页面,3在弹出的“重复区域”对话框中设置显示10条新闻，如图所示。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第六步 在新闻标题上添加“转到详细页面”服务器行为 1选中表格中新闻标题字段代码“Recordset1.Title”。 2在“服务器行为”面板中单击“+” 按钮，并从弹出菜单中选择“转到详细页面”服务器行为。 3在弹出的“转到详细面”对话框中设置各参数，如图所示。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,第七步 记录集分页 1将光标置于表格的右边，按Enter键换行。 2单击

43、菜单“插入”“数据对象”“记录集分页” “记录集导航条”命令或点击“数据”工具栏中“记录集分页：记录集导航条”按钮，打开“记录集导航条”对话框。 3在“记录集导航条”对话框中，设置如图所示。,任务三设计新闻发布模块,任务操作子任务3 制作新闻列表页面,4在“属性”面板中，设置“居中对齐”，将导航条居中。,任务三设计新闻发布模块,任务总结子任务3 制作新闻列表页面,1该页面的制作与首页面的“新闻中心”版块的制作方法相似，创建记录集时不需设置“筛选”项，要设置“排序”项。 2要显示多条记录，需要添加服务器行为“重复区域”；要显示全部记录，需要添加“记录集导航条”来实现翻页。,任务三设计新闻发布模块

44、,情境导入子任务4 实现主页中的搜索查询功能,一个网站的新闻信息量很大，浏览者一般只喜欢看自己感兴趣的新闻，如何才能快速查找到自己想看的新闻呢？在页面上通常都添加一个新闻搜索模块，以方便浏览者快速进行新闻的查找。,任务三设计新闻发布模块,任务要求子任务4 实现主页中的搜索查询功能,1掌握搜索查询模块中表单的创建及设置。2掌握记录集代码的修改方法。,任务三设计新闻发布模块,实训设备子任务4 实现主页中的搜索查询功能,配置网络环境的计算机系统，安装有IIS、Dreamweaver CS4、SQL Server 2005数据库及动画制作和图像处理等软件。,任务三设计新闻发布模块,任务分析子任务4 实

45、现主页中的搜索查询功能,在首页中加入站内搜索栏，这样新闻发布系统才不会因日后数据太多而有不易访问的情形发生，浏览者可根据自己喜欢的主题进行内容搜索。设计如图所示。,任务三设计新闻发布模块,任务操作子任务4 实现主页中的搜索查询功能,第一步 创建表单 1在首页的注册登录模块的右边单元格中，插入表单，在表单中再插入一个1行3列的表格。 2在表格的第1个单元格中，插入图片“images/fangdajing.gif”。 3在表格的第2个单元格中，输入文本“请输入关键词：”。,任务三设计新闻发布模块,任务操作子任务4 实现主页中的搜索查询功能,4. 在表格的第3个单元格中，插入一个文本框，命名为“ke

46、yword”，再插入一个提交表单按钮，将其值改为“搜索”，效果如图所示。,任务三设计新闻发布模块,任务操作子任务4 实现主页中的搜索查询功能,第二步 修改记录集 1打开新闻列表页面news.asp，在“绑定”面板中双击打开之前创建的“Recordset1”记录集对话框。 2在此要将记录集Recordset1作一下更改，点击“高级”按钮进入“高级”设置，在原有的SQL语法中，加入一句搜索功能的语句： WHERE news_title like %“&keyword&”% 那么以前的SQL语句将变成如图所示。,任务三设计新闻发布模块,任务操作子任务4 实现主页中的搜索查询功能,任务三设计新闻发布模

47、块,任务操作子任务4 实现主页中的搜索查询功能,3切换到代码设计窗口。找到Recordset1记录集相应的代码并加入代码：keyword=request(“keyword”) 定义keyword为表单中“keyword”的请求变量，如图3-3-28所示，完成设置。 4以上的设置完成后，index.asp系统主页面就有查询功能了，可以按下F12键在浏览器中测试一下是否能正确地查询。,任务三设计新闻发布模块,任务操作子任务4 实现主页中的搜索查询功能,任务三设计新闻发布模块,任务总结子任务4 实现主页中的搜索查询功能,1创建搜索查询表单时，要给添加的文本域命名，在后面修改记录集时要用到。2修改记录

48、集，添加语句WHERE news_title like %“&keyword&”%，实现模糊查询。3在代码设计窗口，在记录集相应代码中添加语句keyword=request(“keyword”)，定义keyword为表单中“keyword”的请求变量。,任务三设计新闻发布模块,任务四 设计留言板模块,网站的留言系统是网站建设中并不可少的一个重要系统，它实现了访客之间的交流和互动。一个典型的网站留言系统一般包括在线留言、留言内容显示、回复留言及后台管理等功能。 该任务要完成的是前台留言的显示功能。,情境导入子任务1 显示留言,1会根据页面功能创建相应的查询记录集。2掌握服务器行为“重复区域”、“

49、转到详细页面”的使用。3会添加记录集导航条。,任务要求子任务1 显示留言,任务四 设计留言板模块,配置网络环境的计算机系统，安装有IIS、Dreamweaver CS4、SQL Server 2005数据库及动画制作和图像处理等软件。,实训设备子任务1 显示留言,任务四 设计留言板模块,打开网站首页index.asp，在导航栏中点击“留言板”链接到留言列表页面board.asp，该页面显示多条留言，包括留言标题和留言时间。如果查看更多留言，可通过页面下边的“记录集导航条”进行翻页显示。点击“留言标题”可链接到留言详细页面board_show.asp，查看该条留言的详细内容。,任务分析子任务1

50、显示留言,任务四 设计留言板模块,第一步 创建留言列表页面利用站点内的模板文件templatesziye.dwt生成一个ASP VBScript动态页，命名为board.asp保存到站点内files文件夹中t4文件夹内。第二步 插入表格1在该页面中插入一个3行3列的表格，宽度设为“90%”，在“属性”面板中将“对齐”设置为“居中对齐”。,任务操作子任务1 显示留言,任务四 设计留言板模块,2将表格第1行的所有单元格合并，输入文本“我要留言”,选中文本后在“属性”面板中将“水平”设置为“右对齐”，在“链接”后的文本框中输入“board_add.asp”，给文本设置链接。3在第2行单元格中分别输入