jQuery基于json与cookie实现购物车的方法


Posted in Javascript onApril 15, 2016

本文实例讲述了jQuery基于json与cookie实现购物车的方法。分享给大家供大家参考,具体如下:

json 格式:

[{'ProductID':ABC','Num':'1'},{'ProductID':DEF,'Num':'2'}]

这里使用到了 $.cookie这个插件。这个插件的代码在文章的最后

/*
添加商品及数量到购物车cookie中,返回当前商品在cookie中的总数
*/
function AddToShoppingCar(id, num) {
  var _num = 1;
  if (num != undefined)
    _num = num;
  var totalNum = _num; //总数默认为传入参数
  var cookieSet = { expires: 7, path: '/' }; //设置cookie路径的
//  $.cookie(cookieProductID, null, cookieSet);//清除Cookie
  var jsonStr = "[{'ProductID':'" + id + "','Num':'" + _num + "'}]"; //构造json字符串,id是商品id  num是这个商品的数量
  if ($.cookie(cookieProductID) == null) {
    $.cookie(cookieProductID, jsonStr, cookieSet); //如果没有这个cookie就设置他
  }
  else {
    var jsonObj = eval('(' + $.cookie(cookieProductID) + ')'); //如果有,把json字符串转换成对象
    var findProduct = false;//是否找到产品ID,找到则为TRUE,否则为FALSH
    for (var obj in jsonObj) {
      if (jsonObj[obj].ProductID == id) {
        jsonObj[obj].Num = Number(jsonObj[obj].Num) + _num;
        totalNum = jsonObj[obj].Num;
        findProduct = true;
        break;
      }
    }
    if (findProduct == false) { //没找到,则添加
      jsonObj[jsonObj.length] = new Object();
      jsonObj[jsonObj.length - 1].ProductID = id;
      jsonObj[jsonObj.length - 1].Num = num;
    }
    $.cookie(cookieProductID, JSON.stringify(jsonObj), cookieSet); //写入coockie  JSON需要json2.js支持
  }
  return totalNum;
  //  alert($.cookie(cookieProductID));
}
//以下为cookie插件代码
jQuery.cookie = function(name, value, options) {
  if (typeof value != 'undefined') { // name and value given, set cookie
    options = options || {};
    if (value === null) {
      value = '';
      options.expires = -1;
    }
    var expires = '';
    if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
      var date;
      if (typeof options.expires == 'number') {
        date = new Date();
        date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
      } else {
        date = options.expires;
      }
      expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
    }
    var path = options.path ? '; path=' + options.path : '';
    var domain = options.domain ? '; domain=' + options.domain : '';
    var secure = options.secure ? '; secure' : '';
    document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
  } else { // only name given, get cookie
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
      var cookies = document.cookie.split(';');
      for (var i = 0; i < cookies.length; i++) {
        var cookie = jQuery.trim(cookies[i]);
        // Does this cookie string begin with the name we want?
        if (cookie.substring(0, name.length + 1) == (name + '=')) {
          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
          break;
        }
      }
    }
    return cookieValue;
  }
};

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

Javascript 相关文章推荐
JavaScript设置FieldSet展开与收缩
May 15 Javascript
JavaScript原型继承之基础机制分析
Aug 26 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 Javascript
JS判断、校验MAC地址的2个实例
May 05 Javascript
JSP中使用JavaScript动态插入删除输入框实现代码
Jun 13 Javascript
JS模拟酷狗音乐播放器收缩折叠关闭效果代码
Oct 29 Javascript
BootstrapValidator超详细教程(推荐)
Dec 07 Javascript
微信小程序实现分享朋友圈的图片功能示例
Jan 18 Javascript
JS实现的贪吃蛇游戏案例详解
May 01 Javascript
nginx配置域名后的二级目录访问不同项目的配置操作
Nov 06 Javascript
Node.js中的异步生成器与异步迭代详解
Jan 31 Javascript
原生Js 实现的简单无缝滚动轮播图的示例代码
May 10 Javascript
Window.Open打开窗体和if嵌套代码
Apr 15 #Javascript
jQuery设置Cookie及删除Cookie实例分析
Apr 15 #Javascript
jQuery获取cookie值及删除cookie用法实例
Apr 15 #Javascript
jQuery通过写入cookie实现更换网页背景的方法
Apr 15 #Javascript
jquery.cookie.js实现用户登录保存密码功能的方法
Apr 15 #Javascript
jQuery遍历DOM元素与节点方法详解
Apr 14 #Javascript
jQuery中的基本选择器用法学习教程
Apr 14 #Javascript
You might like
Smarty+QUICKFORM小小演示
2007/02/25 PHP
php面象对象数据库操作类实例
2014/12/02 PHP
PHP实现通用alert函数的方法
2015/03/11 PHP
PHP中Trait及其应用详解
2017/02/14 PHP
PHP中遍历数组的三种常用方法实例分析
2019/06/24 PHP
JAVASCRIPT 对象的创建与使用
2021/03/09 Javascript
jQuery 使用手册(一)
2009/09/23 Javascript
jQuery的学习步骤
2011/02/23 Javascript
javascript实现漂亮的拖动层,窗口拖拽特效
2015/04/24 Javascript
浅谈jquery中delegate()与live()
2015/06/22 Javascript
JQuery导航菜单选择特效
2016/04/11 Javascript
基于jquery实现的鼠标悬停提示案例
2016/12/11 Javascript
vue.js树形组件之删除双击增加分支实例代码
2017/02/28 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
2017/04/27 Javascript
jQuery事件委托代码实践详解
2019/06/21 jQuery
JavaScript实现答题评分功能页面
2020/06/24 Javascript
[48:45]Ti4 循环赛第二日 NEWBEE vs EG
2014/07/11 DOTA
[51:17]VGJ.T vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python目录操作之python遍历文件夹后将结果存储为xml
2014/01/27 Python
python实现将html表格转换成CSV文件的方法
2015/06/28 Python
轻松实现python搭建微信公众平台
2016/02/16 Python
深入浅析ImageMagick命令执行漏洞
2016/10/11 Python
Python批处理删除和重命名文件夹的实例
2018/07/11 Python
python3.7 利用函数os pandas利用excel对文件名进行归类
2019/09/29 Python
Python类及获取对象属性方法解析
2020/06/15 Python
OpenCV利用python来实现图像的直方图均衡化
2020/10/21 Python
全球知名的珠宝首饰品牌:Kay Jewelers
2018/02/11 全球购物
英国优质家居用品网上品牌:URBANARA
2018/06/01 全球购物
英国伦敦的睡衣品牌:Asceno
2019/10/06 全球购物
什么是事务?为什么需要事务?
2012/01/09 面试题
服装设计专业求职信
2014/06/16 职场文书
班子四风对照检查材料
2014/08/21 职场文书
贴吧吧主申请感言
2015/08/03 职场文书
DjangoRestFramework 使用 simpleJWT 登陆认证完整记录
2021/06/22 Python
详解nginx location指令
2022/01/18 Servers
python自动化测试之Selenium详解
2022/03/13 Python