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 相关文章推荐
Array.prototype.slice 使用扩展
Jun 09 Javascript
基于jquery的时间段实现代码
Aug 02 Javascript
jquery中交替点击事件toggle方法的使用示例
Dec 08 Javascript
浅析AngularJS中的生命周期和延迟处理
Jun 18 Javascript
jQuery实现Meizu魅族官方网站的导航菜单效果
Sep 14 Javascript
浅谈javascript基础之客户端事件驱动
Jun 10 Javascript
Javascript中arguments对象的详解与使用方法
Oct 04 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
vue-music 使用better-scroll遇到轮播图不能自动轮播问题
Dec 03 Javascript
ES6 Array常用扩展的应用实例分析
Jun 26 Javascript
Vue数据双向绑定底层实现原理
Nov 22 Javascript
vue mvvm数据响应实现
Nov 11 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静态新闻列表自动生成代码
2007/06/14 PHP
很让人受教的 提高php代码质量36计
2012/09/05 PHP
apache中为php 设置虚拟目录
2014/12/17 PHP
thinkphp3.2.3版本的数据库增删改查实现代码
2016/09/22 PHP
PHP对象、模式与实践之高级特性分析
2016/12/08 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
WordPress 照片lightbox效果的运用几点
2009/06/22 Javascript
Ext GridPanel加载完数据后进行操作示例代码
2014/06/17 Javascript
浅析node.js中close事件
2014/11/26 Javascript
javascript闭包功能与用法实例分析
2017/04/06 Javascript
vue移动端实现下拉刷新
2018/04/22 Javascript
Vue之mixin全局的用法详解
2018/08/22 Javascript
vue动态设置img的src路径实例
2018/09/18 Javascript
koa+mongoose实现简单增删改查接口的示例代码
2019/05/13 Javascript
CKeditor4 字体颜色功能配置方法教程
2019/06/26 Javascript
vue 地区选择器v-distpicker的常用功能
2019/07/23 Javascript
layui 阻止图片上传的实例(before方法)
2019/09/26 Javascript
浅谈layui 表单元素的选中问题
2019/10/25 Javascript
LayUi数据表格自定义赋值方式
2019/10/26 Javascript
JS实现放烟花效果
2020/03/10 Javascript
使用PYTHON接收多播数据的代码
2012/03/01 Python
Python中转换角度为弧度的radians()方法
2015/05/18 Python
Django实现组合搜索的方法示例
2018/01/23 Python
对python tkinter窗口弹出置顶的方法详解
2019/06/14 Python
详谈tensorflow gfile文件的用法
2020/02/05 Python
Keras搭建自编码器操作
2020/07/03 Python
Melissa香港官网:MDreams
2016/07/01 全球购物
美体小铺英国官网:The Body Shop英国
2017/01/24 全球购物
SportsDirect.com新加坡:英国第一体育零售商
2019/03/30 全球购物
2014年圣诞节促销方案
2014/03/14 职场文书
同居协议书范本
2014/04/23 职场文书
医学专业自荐信
2014/06/14 职场文书
中共广东省委常委会党的群众路线教育实践活动整改方案
2014/09/23 职场文书
Ruby使用Mysql2连接操作MySQL
2022/04/19 Ruby
java中如何截取字符串最后一位
2022/07/07 Java/Android