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 学习笔记(四)
Dec 31 Javascript
基于jquery扩展漂亮的CheckBox(自己编写)
Nov 19 Javascript
网页禁用右键菜单和鼠标拖动选择方法小结
Feb 25 Javascript
JavaScript实现找质数代码分享
Mar 24 Javascript
简述JavaScript提交表单的方式 (Using JavaScript Submit Form)
Mar 18 Javascript
js利用clipboardData实现截屏粘贴功能
Oct 12 Javascript
Bootstrap 网站实例之单页营销网站
Oct 20 Javascript
JavaScript自定义分页样式
Jan 17 Javascript
Angular ui.bootstrap.pagination分页
Jan 20 Javascript
jQuery基本筛选选择器实例代码
Feb 06 Javascript
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
基于JS判断对象是否是数组
Jan 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
全国FM电台频率大全 - 4 山西省
2020/03/11 无线电
967 个函式
2006/10/09 PHP
php实现图片缩放功能类
2013/12/18 PHP
PHP实现图片裁剪、添加水印效果代码
2014/10/01 PHP
thinkPHP实现递归循环栏目并按照树形结构无限极输出的方法
2016/05/19 PHP
jquery imgareaselect 使用利用js与程序结合实现图片剪切
2009/07/30 Javascript
jQuery验证Checkbox是否选中的代码 推荐
2011/09/04 Javascript
JQuery.closest(),parent(),parents()寻找父结点
2012/02/17 Javascript
JS中实现replaceAll的方法(实例代码)
2013/11/12 Javascript
javascript框架设计读书笔记之数组的扩展与修复
2014/12/02 Javascript
基于jQuery实现网页进度显示插件
2015/03/04 Javascript
JavaScript中this详解
2015/09/01 Javascript
使用jQuery处理AJAX请求的基础学习教程
2016/05/10 Javascript
jQuery数据检索中根据关键字快速定位GridView指定行的实现方法
2016/06/08 Javascript
JavaScript实现自动切换图片代码
2016/10/11 Javascript
使用grunt合并压缩js和css文件的方法
2017/03/02 Javascript
VUE动态生成word的实现
2020/07/26 Javascript
[47:45]Liquid vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
在Django框架中运行Python应用全攻略
2015/07/17 Python
基于python元祖与字典与集合的粗浅认识
2017/08/23 Python
python数字图像处理之高级滤波代码详解
2017/11/23 Python
Python排序搜索基本算法之插入排序实例分析
2017/12/11 Python
python实现Adapter模式实例代码
2018/02/09 Python
python3.5基于TCP实现文件传输
2020/03/20 Python
python版百度语音识别功能
2019/07/09 Python
python框架django项目部署相关知识详解
2019/11/04 Python
python 异步async库的使用说明
2020/05/04 Python
浅谈利用缓存来优化HTML5 Canvas程序的性能
2015/05/12 HTML / CSS
详解如何在登录过期后跳出Ifram框架
2020/09/10 HTML / CSS
不用游标的SQL语句有哪些
2012/09/07 面试题
中秋节礼品促销方案
2014/02/02 职场文书
群众路线剖析材料
2014/02/02 职场文书
商务日语专业毕业生自荐信
2014/03/27 职场文书
讲文明树新风演讲稿
2014/05/12 职场文书
领导班子在批评与自我批评座谈会上的发言
2014/09/28 职场文书
公司催款律师函
2015/05/27 职场文书