1、知识回顾： 网页设计基础知识 B2C网站需求分析 B2C网站功能设计,网站设计,网站前台功能,网站后台功能,第15讲 网站前台设计,15.1 网站首页设计 15.2 相关页面设计 15.3 网站风格设计 15.4 访问控制设计 15.5 公共模块设计 15.6 信息分页设计 15.7 购物车设计,15.1 首页设计,页面实现技术：框架技术 表格技术,15.2 相关页面设计 一、用户管理： 1、登陆信息处理页面（user/ucon.jsp）:连接数据库，查找符合条件的记录，如果找到显示登陆成功，并给用户发放钥匙：session.setAttribute(“username“,username);
2、 2、注册信息管理 （1）注册信息提交(user/index.htm) 表单校验 （2）连接数据库，写入数据(user/check.jsp) 3、修改信息管理（对已登陆用户） （1）连接数据库，按用户名查找个人信息并显示，提交修改信息(user/uedit.jsp) （2）连接数据库，更新数据表中信息(user/ucheck.jsp) 4、查找密码管理（对已登陆用户） （1）问题提交页面(user/pass.jsp) 表单校验 （2）连接数据库，查找并输出密码(user/res.jsp),二、商品操作 1、商品浏览 连接数据库，无条件查询并显示商品信息 2、商品搜索 连接数据库，按条件查询并显
3、示商品信息 三、订单管理 1、提交 提交订单信息连接数据库，写入数据表 2、查询 连接数据库，按订单号查询并显示商品信息 四、留言板 1、提交 提交订单信息连接数据库，写入数据表 2、浏览 连接数据库，按订单号查询并显示商品信息 五、友情连接 浏览 连接数据库，查询并显示连接信息 六、公告栏 浏览 连接数据库，查询并显示公告信息 七、销售排行 浏览 连接数据库，按销量查询并显示商品名字,页面转换时要注意保持样式的统一,保证页面代码的精炼,15.3 风格设计,一、导航栏的设计 top.jsp: 用户登录 0,二、样式设计style.css为了样式重用，统一风格，使用外部样式表。style.css
4、文件: Bodymargin-left: 0px;margin-top: 0px; td font-size: 9pt; color: #000000; .he font-size:18pt; color:#ffffff; font:“黑体“; . 网页里导入.css文件的语句：网页里调用样式的语句：如index.jsp,15.4 访问控制设计 一、登录成功时发放钥匙： String sql=“select * from tb_User where Username=“+username+“ and Userpass=“+password+“; ResultSet rs=con.execute
5、Query(sql); if(rs.next()session.setAttribute(“username“,username); 二、在需要访问权限时对用户进行判断： %if(session.getAttribute(“username“)=null) out.println(“您还没有登录“); window.location.href=“/index.jsp“;,15.5 公共模块设计 一、动态效果设计Javascript技术。使用方法： 1、直接加入HTML文档 语法格式：alert(“购物车中已被清空“);window.location.href=“/index.jsp“;2、引用
6、.js文件 引用一个Javascript源文件（以js为扩展名），以提高程序代码的利用率。其基本格式如下： .js是javascript文件的扩展名，为html文件外独立存在的一个文件。 3、两种方式混合使用引入.js文件的同时加入javascript脚本。,DateTime2.js：X function ShowTime(Elements)var temp = “;if(hour = 0 ,二、字符集转换类 str.java,public String toChinese(String str)if(str=null|str.length()1)str=“;elsetry str=(new
7、String(str.getBytes(“iso-8859-1“),“GB2312“); catch (UnsupportedEncodingException e) System.err.print(e.getMessage();e.printStackTrace();return str;return str;,二、购物车类 buyList.java,package com.bwm.cart; public class buyList public String warename;public int price;public int number; ,三、数据库的访问 Condb.jav
8、a,package com; import java.sql.*; public class Login String logname, realname, password,phone,address;String success=“false“,message=“; Connection con;Statement sql; ResultSet rs;public Login() Class.forName(“sun.jdbc.odbc.JdbcOdbcDriver“); con=DriverManager.getConnection(“jdbc:odbc:shop“,“,“); sql=
9、con.createStatement(); ,15.6 信息分页设计 1、限制页面显示商品数量代码,String sql=“select * from tb_Ware order by Dattime“; ResultSet rs=con.executeQuery(sql); int count=0; while(rs.next()count+;if(count=9)break;执行语句；,翻页设置页面middle.jsp:alert(“记录集中没有记录“);history.back()% else,rs.last(); rowcount=rs.getRow(); String topage
10、=request.getParameter(“topage“);pagecount=(rowcount%pagesize=0)?(rowcount/pagesize):(rowcount/pagesize+1);if(topage!=null)showpage=Integer.parseInt(topage);if(showpagepagecount)showpage=pagecount;else if(showpage=0)showpage=1;rs.absolute(showpage-1)*pagesize+1);for(int j=1;j=pagesize;j+)if(rs.isAfte
11、rLast()break;String warename=rs.getString(2);String wareprice=rs.getString(3);String wareintro=rs.getString(5);String img=rs.getString(6);,if(j%2!=0)% “ 名称:价格:介绍:“ 名称:价格:介绍:“,“第一页“上一页“下一页“最后一页 ,15.7 购物车设计 购物过程：,buyList mylist=new buyList();mylist.warename=warename;mylist.price=price;mylist.number=1;
12、Vector shop=(Vector)session.getAttribute(“shop“);if(shop=null)shop=new Vector();shop.addElement(mylist);session.setAttribute(“shop“,shop);,向购物车内添加商品,1、使用向量vector,一、session购物车,Vector newshop=new Vector();session.removeAttribute(“shop“);,删除购物车内商品, ￥ “ size=“7“ type=“text“ class=“txt_grey“ value=“ ￥,将购
13、物车内商品返回输出,buyList mylist=new buyList();mylist.warename=warename;mylist.number=1;boolean listFlag=true;Vector shop=(Vector)session.getAttribute(“shop“);if(shop=null)shop=new Vector();elsefor(int i=0;ishop.size();i+)buyList list=(buyList)shop.elementAt(i);if(list.warename=mylist.warename)list.number+;
14、shop.setElementAt(list,i);listFlag=false; if(listFlag)shop.addElement(mylist);session.setAttribute(“shop“,shop);,修改购物车内商品,2、使用ArrayList对象, ,向购物车内添加商品,“+(String)temp.get(i)+“);out.print(“+(String)temp.get(i+1)+“);out.print(“删除商品“);out.print(“);% ,将购物车内商品返回输出,ArrayList list=(ArrayList)session.getAttri
15、bute(“bag“);int i=Integer.parseInt(request.getParameter(“id“);list.remove(i);,删除购物车内商品,二、Cookie购物车使用cookie对象存储,good、price属性存在一个字符串中，使用计数函数 a( ) 为cookie命名。, “);Cookie cookies=request.getCookies();for(int i=0;i“);a();%,三、数据库购物车,%String good=request.getParameter(“good“) ;String price=request.getParameter(“price“) ;Connection con;Statement sql; ResultSet rs;tryClass.forName(“sun.jdbc.odbc.JdbcOdbcDriver“);catch(ClassNotFoundException e)try con=DriverManager.getConnection(“jdbc:odbc:gw“,“,“);sql=con.createStatement();if(price!=null ,向购物车内添加商品,“删除,将购物车内商品返回输出,删除购物车内商品,
