JavaWeb - 小米商城：商品添加到购物车

JavaWeb - 小米商城：商品添加到购物车

1.功能描述

接上篇 JavaWeb - 仿小米商城（5）：商品详情展示 本篇博客将分析和实现小米商城商品添加到购物车 和展示。如以下H5页面所示：

2.功能分析

2.1 功能逻辑抽象

商品购物车功能在逻辑上并不复杂：在商品界面每当点击商品 <img>标签或商品名称时，都会向后端提 交一个 GET 请求来将本商品数据内容添加到Session。后端在收到请求后查询数据库并以Map形式储存 内容到session。

商品购物车是面向数据库中的 tb_cart表，在购物车列表页面点击结算将数据添加到数据表。在开发时基 于三层架构体系建立对应的 CartServlet 类、CartService 接口和实现类、CartDao 接口和实现类。

备注: vo , dto , domain , entity , pojo 的含义

POJO（Plain Ordinary Java Object）简单的Java对象，实际就是普通JavaBeans(规范),pojo是业务称呼.

entity:实体类,一个类,属性严格对应一个表格的行数据

domain:封装数据库的javabean对象,一个对象可以封装多个表格数据.（domain的范围大于entity）

DTO:专门负责接收前端表格数据的对应结构的javabean.

vo:view object,视图对象,ajax要什么,就封装什么

---

POJO与JavaBean的比较：

pojo:用于数据的临时传递，它只能装载数据，作为数据存储的载体，不具有业务逻辑的处理能力。
javaBean:与pojo相比，它里面可以有其他方法。
JavaBean是可重用组件，需要符合以下条件：

这个类必须有一个公共的缺省构造函数
这个类的属性使用getter和setter来访问设置数据，其他方法遵从标准命名规范
这个类可以序列化

3.代码实现

3.1前端

3.1.1 修改商品详情a链接地址

3.1.2编写cart.html

前端在加载html内容时便向后端提交异步请求, 在购物车详情页面查询CartServlet里的showCart方法数据

<script type="text/javascript">
       //加1
        function    pNum(pid, p, no) {
     
     
            var nums = $("#num_count" + no).val();
            if (Number(nums) >= 5) {
     
     
                alert("每个商品每人限购5件")
            } else {
     
     
                //购买的数量不能超过总库存
                nums = parseInt(nums) + 1;
            }
            $.ajax({
     
     
                url: "cart.do?action=updateCartNum&pid=" + pid + "&num=" + nums + "&price=" + p,
                method: "get",
                success: function () {
     
     
                    location.href = "cart.html";
                },
                error: function () {
     
     
                    alert("服务器异常");
                }
            })
        }

        //减1
        function mNum(pid, p, no) {
     
     
            var nums = $("#num_count" + no).val();
            nums = parseInt(nums) - 1;
            if (Number(nums) <= 1) {
     
     
                nums = 1;
                alert("最少不能少于1件!")
            }
            $.ajax({
     
     
                url: "cart.do?action=updateCartNum&pid=" + pid + "&num=" + nums + "&price=" + p,
                method: "get",
                success: function () {