jquery.cookie实现的客户端购物车操作实例


Posted in Javascript onDecember 24, 2015

本文实例讲述了jquery.cookie实现的客户端购物车操作。分享给大家供大家参考,具体如下:

//购物车
var Cart = function () {
  this.Count = 0;
  this.Total = 0;
  this.Items = new Array();
};
//购物车集合对象
var CartItem = function () {
  this.Id = 0;
  this.Name = "";
  this.Count = 0;
  this.Price = 0;
};
 
//购物车操作
var CartHelper = function () {
  this.cookieName = "yxhCart";
  this.Clear = function () {
    var cart = new Cart();
    this.Save(cart);
    return cart;
  };
  //向购物车添加
  this.Add = function (id, name, count, price) {
    var cart = this.Read();
    var index = this.Find(id);
    //如果ID已存在,覆盖数量
    if (index > -1) {
      cart.Total -= (((cart.Items[index].Count * 100) * (cart.Items[index].Price * 100)) / 10000);
      cart.Items[index].Count = count;
      cart.Total += (((cart.Items[index].Count * 100) * (cart.Items[index].Price * 100)) / 10000);
    } else {
      var item = new CartItem();
      item.Id = id;
      item.Name = name;
      item.Count = count;
      item.Price = price;
      cart.Items.push(item);
      cart.Count++;
      cart.Total += (((cart.Items[index].Count * 100) * (cart.Items[index].Price * 100)) / 10000);
    }
    this.Save(cart);
    return cart;
  };
  //改变数量
  this.Change = function (id, count) {
    var cart = this.Read();
    var index = this.Find(id);
    cart.Items[index].Count = count;
    this.Save(cart);
    return cart;
  };
  //移出购物车
  this.Del = function (id) {
    var cart = this.Read();
    var index = this.Find(id);
    if (index > -1) {
      var item = cart.Items[index];
      cart.Count--;
      cart.Total = cart.Total - (((item.Count * 100) * (item.Price * 100)) / 10000);
      cart.Items.splice(index, 1);
      this.Save(cart);
    }
    return cart;
  };
  //根据ID查找
  this.Find = function (id) {
    var cart = this.Read();
    var index = -1;
    for (var i = 0; i < cart.Items.length; i++) {
      if (cart.Items[i].Id == id) {
        index = i;
      }
    }
    return index;
  };
  //COOKIE操作
  this.Save = function (cart) {
    var source = "";
    for (var i = 0; i < cart.Items.length; i++) {
      if (source != "") { source += "|$|"; }
      source += this.ItemToString(cart.Items[i]);
    }
    $.cookie(this.cookieName, source);
  };
  this.Read = function () {
    //读取COOKIE中的集合
    var source = $.cookie(this.cookieName);
    var cart = new Cart();
    if (source == null || source == "") {
      return cart;
    }
    var arr = source.split("|$|");
    cart.Count = arr.length;
    for (var i = 0; i < arr.length; i++) {
      var item = this.ItemToObject(arr[i]);
      cart.Items.push(item);
      cart.Total += (((item.Count * 100) * (item.Price * 100)) / 10000);
    }
    return cart;
  };
  this.ItemToString = function (item) {
    return item.Id + "||" + escape(item.Name) + "||" + item.Count + "||" + item.Price;
  };
  this.ItemToObject = function (str) {
    var arr = str.split('||');
    var item = new CartItem();
    item.Id = arr[0];
    item.Name = unescape(arr[1]);
    item.Count = arr[2];
    item.Price = arr[3];
    return item;
  };
};

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JS类中定义原型方法的两种实现的区别
Mar 08 Javascript
jquery连缀语法如何实现
Nov 29 Javascript
jQuery $.extend()用法总结
Jun 15 Javascript
JS实现简单的图书馆享元模式实例
Jun 30 Javascript
在Linux系统中搭建Node.js开发环境的简单步骤讲解
Jan 26 Javascript
AngularJS基础 ng-paste 指令简单示例
Aug 02 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
Nov 03 Javascript
vue2 mint-ui loadmore实现下拉刷新,上拉更多功能
Mar 21 Javascript
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
JavaScript实现的联动菜单特效示例
Jul 08 Javascript
详解vue-video-player使用心得(兼容m3u8)
Aug 23 Javascript
js实现验证码功能
Jul 24 Javascript
jQuery基于cookie实现的购物车实例分析
Dec 24 #Javascript
jQuery实现网页顶部固定导航效果代码
Dec 24 #Javascript
jQuery的选择器中的通配符[id^='code']或[name^='code']及jquery选择器总结
Dec 24 #Javascript
基于jQuery实现左右图片轮播(原理通用)
Dec 24 #Javascript
jquery捕捉回车键及获取checkbox值与异步请求的方法
Dec 24 #Javascript
jquery遍历函数siblings()用法实例
Dec 24 #Javascript
jQuery中的siblings用法实例分析
Dec 24 #Javascript
You might like
php下使用无限生命期Session的方法
2007/03/16 PHP
Array of country list in PHP with Zend Framework
2011/10/17 PHP
PHP5.5基于mysqli连接MySQL数据库和读取数据操作实例详解
2019/02/16 PHP
PHP开发api接口安全验证操作实例详解
2020/03/26 PHP
jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)
2013/02/04 Javascript
js的alert弹出框出现乱码解决方案
2013/09/02 Javascript
jQuery extend 的简单实例
2013/09/18 Javascript
JavaScript为事件句柄绑定监听函数实例详解
2015/12/15 Javascript
老生常谈JavaScript 函数表达式
2016/09/01 Javascript
Nodejs 发送Post请求功能(发短信验证码例子)
2017/02/09 NodeJs
分享十三个最佳JavaScript数据网格库
2017/04/07 Javascript
JS中使用gulp实现压缩文件及浏览器热加载功能
2017/07/12 Javascript
基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)
2017/11/21 Javascript
从零开始实现Vue简单的Toast插件
2018/12/03 Javascript
Vue调用后端java接口的实例代码
2019/10/28 Javascript
node.js使用zlib模块进行数据压缩和解压操作示例
2020/02/12 Javascript
浅谈vue.watch的触发条件是什么
2020/11/07 Javascript
python中对数据进行各种排序的方法
2019/07/02 Python
python matplotlib库绘制条形图练习题
2019/08/10 Python
python将print输出的信息保留到日志文件中
2019/09/27 Python
Django权限设置及验证方式
2020/05/13 Python
520使用Python实现“我爱你”表白
2020/05/20 Python
python中upper是做什么用的
2020/07/20 Python
html5的自定义data-*属性与jquery的data()方法的使用
2014/07/02 HTML / CSS
Omio中国:全欧洲低价大巴、火车和航班搜索和比价
2018/08/09 全球购物
罗马尼亚购物网站:Vivantis.ro
2019/07/20 全球购物
德国咖啡批发商:Coffeefair
2019/08/26 全球购物
毕业生个人的求职信范文
2013/12/03 职场文书
大学生涯自我鉴定
2014/01/16 职场文书
暑期研修感言
2014/02/17 职场文书
节约电力资源的建议书
2014/03/12 职场文书
三八红旗手先进事迹材料
2014/05/13 职场文书
学生夜不归宿检讨书
2014/09/23 职场文书
召开会议通知范文
2015/04/15 职场文书
工作感想范文
2015/08/07 职场文书
《现实主义勇者的王国再建记》第三弹OST全曲试听片段公开
2022/04/04 日漫