网页设计与制作 邬锦霞 第14章 电子商务网站制作实例

《网页设计与制作 邬锦霞 第14章 电子商务网站制作实例》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第14章电子商务网站制作实例随着互联网技术的发展，网上书店已成为传统书籍销售的重要补充。目前，网上书店在国际互联网上可以实现的商务已经多样化，可以完成从最基本的信息展示、信息发布功能到在线交易、在线客户服务、在线网站管理功能等，可以说，传统书店所具备的功能几乎都可以在互联网上进行电子化的高效动作。本章所制作的网上书店系统具备的功能有：（1）用户注册、登陆、以及用户信息修改；（2）图书展示、图书购买、图书结账；（3）管理图书，包括添加图书、修改、删除等。14.1网站结构和数据库设计1.网上书店网站主要页面：（1）首页（in

2、dex.asp）：首页分成几个模块，包括用户登陆和注册模块；书籍分类列表；以及新书推介和特价优惠书；（2）书籍浏览页（main.asp）：此页面主要是通过分类浏览所有书籍，点击每一本书可以查看该书的详细信息；（3）按出版社浏览（press.asp）：在此页面是通过按出版社浏览书籍，点击每一本书可以查看该书的详细信息；（4）购书页面（shop.asp）：在此页面进行购书、付款、结账等操作；（5）后台管理首页（Alllist.asp）：用户登录后进入此页，该页列出了数据库所有的书籍，并可对每一本书的信息进行修改和删除；（6）

3、编辑页面（Editbook.asp）：此页面对书籍的信息进行修改；（7）删除页面（Deletebook.asp）：从数据库删除选中的书籍信息；（8）添加页面（Addtype.asp/Addpress.asp/Addbook.asp）：在此页面添加新的书籍种类、新的出版社以及新的书籍。2.数据库的设计数据库的支持是网上书店实现功能的关键，本系统的数据库bookshop采用SQLServer2000设计，主要包括几个数据表。（1）数据表admin用于存储管理员的信息，包括用户名和密码，只有管理员才有权限对后台数据进行管理，如

4、图1所示。图1:（2）数据表customer用于存储注册顾客的信息，包括顾客的姓名、密码、性别、邮件、地址等信息，如图2所示。图2:（3）数据表book存储书籍的相关信息，如图3所示。图3:（4）数据库表press用于存储出版社的信息，包括出版社ID，名称以及出版社简介，如图4所示。图4:（5）数据表type用于存储书籍分类信息，包括分类ID，分类名称和分类简介，如图5所示。图5:（6）数据表sell用于存储顾客购书的订单信息，包括顾客名称、书籍ID、购书数量、购书时间等，如图6所示。图6:14.2网站前台功能设计与实现

5、14.2.1网站主页设计在Dreamweaver8中新建一个站点XWSD，然后新建一个主页文件，保存为index.asp。（1）首先在页面插入一个1行3列的表格，在每个单元格分别插入Logo、banner和辅助信息，如图7所示。图7:（2）在表格下方插入两个表格，分别设置不同的背景颜色，第二个表格输入文本作为导航条，如图8所示。图8:（3）在导航栏下方插入1行2列的表格，在左边单元格制作用户登陆和注册的模块，以及书籍分类显示，右边单元格显示两项内容，包括新书推介和特价优惠书，如图9所示。图9:14.2.2注册登录模块设计

6、下面具体介绍注册和登陆模块的制作方法：（1）注册模块：根据数据库的设计，制作注册表单如图10所示。图10:然后选中表单，在服务器行为中选择插入纪录，弹出所示的对话框，并进行设置，如图11。图11:（2）登陆模块，根据数据库的设计，制作登陆表单如图12所示。图12:然后选中表单，在服务器行为中选择“用户身份验证》登陆用户”，弹出对话框，并进行相应的设置，如图13所示。图13:14.2.3商品展示功能设计书籍展示包括2个方面，一是按书籍的类型进行浏览，二是按出版社类别进行浏览，首先介绍按书籍类型浏览页的制作。顾客登陆后会自动

7、转向main.asp页面，该页面提供了2种浏览方式，找到想要的图书后，点击就可以查看该书的详细信息，此页面的设计如图14所示。图14:页面的左边是书籍分类的导航，而右边则会显示相应类型的书籍列表，所以我们在此页面要创建2个记录集，其中一个为查询书籍类别的“typere”，如图15所示。图15:另一个记录集是“rsbook”，该记录集的功能是根据“typere”选中的书籍类别，从数据库中取出相应的书籍和出版社，并显示在页面上，其设置如图16所示。图16:打开绑定面板，将记录集的相应字段绑定到网页中并设置重复区域，如图14-

8、14所示。选中动态文本“rsbook.name”，在服务器行为中选择“转到详细页面”选项，在弹出的对话框中进行设置，目的是为了把“book.id”参数传递至shophelp.asp页面，以实现详细信息的浏览，如图17所示。图17:选中动态文本“typere.type”，并在服务器行为版面中选择“转到详细页面”，在弹出