购物车（session版）

目录：

一：详解购物车

1.1：购物车页面数据绑定

1.2：购物车功能（添加，删除，结算）

二：项目美化小知识

一：详解购物车

注：session版购物车它是在eclipse项目中利用Java Resources，WebContenti以及数据库的结合。(但session版本的购物车增删改是不会影响在数据库中的数据的！！！)

导包：lib下的ojdbc14.jar;

以及添加自己的css样式和js文件，有需要的话可以添加fonts(字体样式)文件

1.1购物车数据绑定（index页面）

记得连接数据库（需要帮助类，商品实体类（这里省去，就不详解代码了））

<%@page import="entity.Goods"%>
<%@page import="java.util.ArrayList"%>
<%@page import="dao.GoodsDao"%>
<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript">function gm(bid) {location.href="doshopping.jsp?bid="+bid;}
</script>
</head>
<body><table class="table table-hover"><tr><td>商品编号</td><td>商品名称</td><td>商品单价</td><td>商品介绍</td><td>商品图片</td><td>操作一下</td></tr><%GoodsDao gd=new GoodsDao();ArrayList<Goods> glist=gd.getAll();for(Goods g:glist){%><tr><td><%=g.getBid() %></td><td><%=g.getBname() %></td><td><%=g.getBprice() %></td><td><%=g.getBinfo() %></td><td><img alt="" src="<%=g.getBface()%>"></td><td><button onclick="gm(<%=g.getBid() %>)" class="btn btn-success">添加购物车</button></td></tr><%} %></table>
</body>
</html>

index和购物车页面在写代码之前一定要注意写入（一般建议直接复制，难免出错）

<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>

然后就是方法类（查询所有商品）实现数据的绑定

public ArrayList<Goods> getAll(){ArrayList<Goods> glist = new ArrayList<>();Connection con = null;PreparedStatement ps = null;ResultSet rs = null;try {con = DBHelper.getCon();String sql = "select * from goods";ps = con.prepareStatement(sql);rs = ps.executeQuery();while(rs.next()) {glist.add(new Goods(rs.getInt(1), rs.getString(2), rs.getDouble(3), rs.getString(4), rs.getString(5)));}   } catch (Exception e) {e.printStackTrace();}finally {DBHelper.closeDb(con, ps, rs);}    return glist;}

1.2:把订单集合放入session中，实现购物车页面的订单的增加

（需要购物车类，购物车帮助类以及订单实体类（不详解），方法类）

购物车帮助类(doshopping)

实现购物车文本框的修改（单品总价格会随修改数量而改变）

<%@page import="java.util.ArrayList"%>
<%@page import="dao.GoodsDao"%>
<%@page import="entity.OrderItem"%>
<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%><!DOCTYPE html>
<%//获取商品订单的数量String number=request.getParameter("gn");int count=1;if(number!=null){count=Integer.valueOf(number);}//接收商品编号String id=request.getParameter("bid");//System.out.print(id);int bid=Integer.valueOf(id);//构造对象OrderItem oi= new OrderItem();//给属性赋值oi.setG(new GoodsDao().getByid(bid));oi.setGnumber(1);oi.setSumPrice();//获取session中的集合订单ArrayList<OrderItem> olist=(ArrayList<OrderItem>)session.getAttribute("olist");if(olist==null){olist=new ArrayList<OrderItem>();}   //便利订单集合，判断是否已存在相同订单boolean b=true;for(int i=0;i<olist.size();i++){if(bid==olist.get(i).getG().getBid()){if(number==null){//修改数量，原来数量+1olist.get(i).setGnumber(olist.get(i).getGnumber()+1);//修改总价olist.get(i).setSumPrice();}else{olist.get(i).setGnumber(count);olist.get(i).setSumPrice();}b=false;}}if(b){//吧订单放到集合中olist.add(oi);} session.setAttribute("olist",olist);//跳转request.getRequestDispatcher("Shop.jsp").forward(request, response);
%>

购物车类（Shop）

<%@page import="entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript">function xg(obj,bid) {var gnumber=obj.value;location.href="Shop.jsp?bid="+bid+"&gn="+gnumber;}
</script>
</head>
<body><h1 align="center"><a href="index.jsp"><span class="glyphicon glyphicon-home" aria-hidden="true"></a></h1><table class="table table-hover"><tr><td><span class="glyphicon glyphicon-camera" aria-hidden="true"></span></td><td><span class="glyphicon glyphicon-heart" aria-hidden="true"></span></td><td><span class="glyphicon glyphicon-yen" aria-hidden="true"></span></td>          <td><span class="glyphicon glyphicon-heart" aria-hidden="true"></span></td><td><span class="glyphicon glyphicon-italic" aria-hidden="true"></span></td><td><span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span></td><td><span class="glyphicon glyphicon-remove-circle" aria-hidden="true"></span></td></tr><%//获取到session中的订单集合ArrayList<OrderItem> olist=(ArrayList<OrderItem>)session.getAttribute("olist");for(OrderItem oi:olist){%><tr><td><img alt="" src="<%=oi.getG().getBface() %>"></td><td><%=oi.getG().getBname() %></td><td><%=oi.getG().getBprice()%></td><td><%=oi.getG().getBinfo()%></td> <td><button class="btn">-</button><input onblur="xg(this,<%=oi.getG().getBid() %>)" style="width:35px;text-align: center" type="text" value="<%=oi.getGnumber()%>"><button class="btn">+</button></td><td><%=oi.getSumPrice() %></td><td><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></td></tr><%} %></table><p align="right"><button class="btn btn-warning">总价：</button></p>
</body>
</html>

订单实体类（注意商品总价的改变）

public double getSumPrice() {return sumPrice;}public void setSumPrice()//无参 {this.sumPrice = g.getBprice()*gnumber;//单价*数量}

方法类（根据编号查询商品对象）

public Goods getByid(int bid){Connection con = null;PreparedStatement ps = null;ResultSet rs = null;Goods g=null;try {con = DBHelper.getCon();String sql = "select * from goods where bid="+bid;ps = con.prepareStatement(sql);rs = ps.executeQuery();if(rs.next()) {g=new Goods(rs.getInt(1), rs.getString(2), rs.getDouble(3), rs.getString(4), rs.getString(5));}    } catch (Exception e) {e.printStackTrace();}finally {DBHelper.closeDb(con, ps, rs);}    return g;}

到目前为止，能达到的是以下界面功能

index

Shop

购物车单品的加减（+、-）及结算,删除

单品加减//Shop

function $(id) {return document.getElementById(id);}function jj(f,bid){if(f=="-"){var number=$("text").value-1;location.href="Shop.jsp?bid="+bid+"&gn="+number;}else if(a=="+"){var number=parseInt($("text").value)+1;location.href="Shop.jsp?bid="+bid+"&gn="+number;}}

<button onclick="jj('-',<%=oi.getG().getBid() %>)" class="btn">-</button>
<button onclick="jj('+',<%=oi.getG().getBid() %>)" class="btn">+</button>

结算

//Shop(定义一个int zj=0;)

<%zj+=oi.getSumPrice();} %>
<button class="btn btn-warning">总价：<%=zj %></button>

//shopping

double sum=0;session.setAttribute("sum", sum);

删除

//Shop

    function $(id) {return document.getElementById(id);}function sc(bid,del){location.href="delete.jsp?bid="+bid;}

<span onclick="sc(<%=oi.getG().getBid() %>)" class="glyphicon glyphicon-trash" aria-hidden="true"></span>

//delete

<%@page import="entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%>
<!DOCTYPE html>
<%ArrayList<OrderItem> olist=(ArrayList<OrderItem>)session.getAttribute("olist");//接收要删除的idint id=Integer.valueOf(request.getParameter("bid"));for(int i=0;i<olist.size();i++){if(id==olist.get(i).getG().getBid()){olist.remove(i);}}session.setAttribute("olist", olist);response.sendRedirect("Shop.jsp");
%>

二：美化美化知识小分享

像图片上的小组件图标，来自www.bootcss.com网站.

还有更多，可以用在自己喜欢的地方。

注意：

图标类不能和其它组件直接联合使用。它们不能在同一个元素上与其他类共同存在。应该创建一个嵌套的 <span> 标签，并将图标类应用到这个 <span> 标签上。

购物车（session版）相关推荐

较为周全的Asp.net提交验证方案(Session版)
此前我介绍了使用数据库实现的提交验证方案,一些朋友怀疑其效率不佳,认为Session是更好的方案. 的确使用Session也不会消耗太多内存,而且如今内存白菜价,最不济就随手买个2G的插上也就够了,所 ...
php购物车面试题,PHP 购物车 session（非框架）
这篇文章是非框架来完成购物车功能的,我还有一篇文章是ThinkPHP框架下完成购物车功能的.点击打开链接这是我的一次面试中的面试题,简单写商城的购物车功能,要求是: 1.自己写简单的前台 2.用户登 ...
面向对象中的session版的购物车
先设置一个product类,用来存储和获取数据,使用LIst集合存储所有商品即(ProductDao类),在ShowProductServlet类查看商品信息,然后将数据提交到AddCarServle ...
购物车完善版，客户余额及所购商品保存在文件
购物车优化: 用户入口: 商品信息存在文件里: 已购商品,余额记录保存在文件里,下次运行程序要读取上一次运行后的余额信息商家入口: 可以添加商品,修改商品价格文件: 1. customer.txt ...
python编码思维导图_Python入门之ATM+购物车代码版思维导图
该项目结合了ATM模版和购物车需求,整个思维导图用Python代码实现,使用思维导图可以清晰明了的看清整个框架: 过程中,用到了Python的知识有Python常用模块,Python常用内置包,log ...
python3 购物车增改查终极版~
还是先来条NLP再说,快没了,以后想抄还没有... 十一,没有挫败,只有回应讯息 "挫败"只是指出过去的做法得不到预期的效果,是给我们需要改变的信号. "挫败" ...
JavaWeb-新版
JavaWeb 参考文章: https://heavy_code_industry.gitee.io/code_heavy_industry/pro001-javaweb/lecture/ 01.We ...
Javaweb （MVC购物车01）
MVC MVC模式(Model-View-Controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model).视图(View)和控制器(Controller). MV ...
php mysql购物车_php mysql购物车实现程序
php mysql购物车实现程序 (2015-05-10 21:31:00) 标签: 股票分类: PHP 简单容易理解.cookie存购物车ID,db存购物车数据. http://www.111cn ...

购物车（session版）

购物车（session版）相关推荐

最新文章

热门文章