前端实现购物车js代码

48人阅读 评论(0) 收藏 举报
分类:
    function Goods(goodsId, goodsNum, goodsStatus) {
        // 0.正常可下单    1.缺货  2.不存在
        this.goodsId = goodsId;
        Goods.prototype.goodsNum = 0;
        if( typeof goodsNum ==="undefined")
        {
            this.goodsNum = Goods.prototype.goodsNum;
        } else {
            this.goodsNum=goodsNum;
        }
        if( typeof goodsStatus ==="undefined")
        {
            this.goodsStatus = Goods.prototype.goodsNum;
        } else {
            this.goodsStatus=goodsStatus;
        }
        Goods.prototype.setGoodsNum = function (goodsId) {
            this.goodsId = goodsId;
        };
        Goods.prototype.setGoodsStatus = function (goodsStatus) {
            this.goodsStatus = goodsStatus;
        };
    }

    var GoodsList = {
        goodsList: [],
        addGoods: function (goods) {
            for (var i = 0; i < this.goodsList.length; i++) {
                if (this.goodsList[i].goodsId === goods.goodsId) {
                    this.goodsList[i].goodsNum+=goods.goodsNum;
                    return;
                }
            }
            this.goodsList.push(goods);
        },
        setGoods: function (goods) {
            for (var i = 0; i < this.goodsList.length; i++) {
                if (this.goodsList[i].goodsId === goods.goodsId) {
                    this.goodsList[i].goodsNum=goods.goodsNum;
                    this.goodsList[i].goodsStatus=goods.goodsStatus;
                    return;
                }
            }
            this.goodsList.push(goods);
        },
        getGoods: function (goodsId) {
            for (var i = 0; i < this.goodsList.length; i++) {
                if (this.goodsList[i].goodsId === goodsId) {
                    return this.goodsList[i];
                }
            }
            return new Goods(goodsId);
        },
        removeGoods:function (goodsId) {
            for (var i = 0; i < this.goodsList.length; i++) {
                if (this.goodsList[i].goodsId === goodsId) {
                    this.goodsList.splice(i,1);
                    return;
                }
            }
        },
        getGoodsCookie:function () {
            return JSON.stringify(this.goodsList);
        },
        setStringCookie:function (cookieList) {
            if (cookieList !== null && cookieList !== undefined && cookieList !== ''&&cookieList!==""&&cookieList.trim().length>0) {
                this.goodsList = JSON.parse(cookieList);
                return;
            }
        }
    };

    var Cookie={
        getShoppingCookie:function () {
            return (function (name)
            {
                var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
                if(arr=document.cookie.match(reg)){
                    var s = decodeURI(arr[2]);
                    if (s[0]=='\"'){
                        return "";
                    }else {
                        return decodeURI(arr[2]);
                    }
                }
                else
                    return "";
            })("shoppingCar");
        },
        setShoppingCookie:function (shoppingCar) {
            document.cookie="shoppingCar="+shoppingCar+"; path=/";
        }
    };
查看评论

购物车(JS代码)

购物车           h1 {         text-align:center;       }       table {         margin:0 auto;      ...
  • shuzhupeng
  • shuzhupeng
  • 2016-05-29 22:35:15
  • 2146

javascript购物车实现详细代码讲解

我们肯定都很熟悉商品购物车这一功能,每当我们在某宝某东上购买商品的时候,看中了哪件商品,就会加入购物车中,最后结算。购物车这一功能,方便消费者对商品进行管理,可以添加商品,删除商品,选中购物车中的某一...
  • zhongguohaoshaonian
  • zhongguohaoshaonian
  • 2016-09-27 21:13:37
  • 43677

原生js实现简易购物车效果

Document *{margin: 0;padding: 0;} ul{list-style: none;} a{text-decoration: none;} .box{ widt...
  • qwe502763576
  • qwe502763576
  • 2018-01-21 14:36:58
  • 169

原生JS实现购物车的添加删除,以及总价计算的功能

add方法,传入一个参数items。items是一个数组,数组元素为{name:String,price:Number}。通过add方法可以在在购物车列表新增商品 bind方法,实现点击删除,能够删除...
  • qq_30604453
  • qq_30604453
  • 2017-09-09 11:19:11
  • 1740

购物车前端开发

作为一名不在软件公司工作的软件工程师,不仅要会写后台代码(PHP/JAVA/SQL...),还是兼顾前端工程师的工作(html/javascript/css...)。下面就来分享一个在实际工作项目中使...
  • chris_mao
  • chris_mao
  • 2015-06-17 21:49:22
  • 12007

简单实现购物车

//实现M层 public class CartModel implements ICartModel { private Handler handler = new Handl...
  • Chenkai_19960607
  • Chenkai_19960607
  • 2017-12-21 10:32:08
  • 69

购物车逻辑实现 思路

购物车列表数据的存储 判断当前用户是否登陆 (通过用户名字去判断)登陆 从redis中获取购物车列表 , 从cookie中获取购物车列表,两种购物车列表合并 通过商品ID , 商品数量,添加到购物...
  • a18302465887
  • a18302465887
  • 2017-10-16 16:41:03
  • 548

淘宝购物车前端(JS和Angularjs版本)

今天用HTML和JS实现以下购物车,然后再用Angualrjs加bootstrap再去实现一下购物车的前端实现。功能页面分析:既然是做模仿淘宝购物车,肯定要先去分析一下淘宝的购物车页面,自己去淘宝卖了...
  • liaodehong
  • liaodehong
  • 2016-09-15 18:21:12
  • 5610

AJAX实现购物车功能的思路

添加到购物车 1、商品页面AJAX提交productid和num数量给后台。 2、后台从SESSION中保存当前用户userID、接收AJAX传过来的数据,根据productid和userID查购物车...
  • weixin_39210100
  • weixin_39210100
  • 2017-12-10 18:36:55
  • 435

购物车H5代码

  • 2017年11月09日 12:27
  • 258KB
  • 下载
    个人资料
    持之以恒
    等级:
    访问量: 16万+
    积分: 3711
    排名: 1万+
    博客专栏