javascript - 更新并删除包含购物车商品的 cookie 中的 json 数据

标签 javascript jquery cookies shopping-cart jquery-cookie

我通过 jquery 将购物车项目(json 数据)存储在 cookie 中。 我可以向 cookie 添加项目。以下是 JavaScript 代码。

$.cookie.json = true;
// empty cart
var emptydata = { "cartItems": [] };

var devicedata = new function (deviceId, qty) {
return { "deviceId": deviceId, "quantity": qty };
}


// to create json data
function createJSON(id, qty) {
    if (!$.cookie('devicelist')) {
      $.cookie('devicelist', emptydata);
    }
 devicedata.deviceId = id;
 devicedata.quantity = qty;
 cart = $.cookie('devicelist');
 cart.cartItems.push(devicedata);
 return cart;
}

// function to be called , when Add to cart button is clicked
function saveItems() {

   var deviceId = $('#lbldeviceId').html();
   var Qty = $('#txtQty').val();

   var jsondata = createJSON(deviceId, Qty);

   $.cookie('devicelist', jsondata);

}

示例 json 数据

 { "cartItems": [
   {
     "deviceId": "1",
     "quantity": "1"
   },
   {
     "deviceId": "2",
     "quantity": "1"
   }
]}

如何更新 cookie 中现有设备的数量并删除现有设备? 希望可以通过循环遍历项目来完成。如果还有其他替代方案,请建议我。我的方法还好吗?还是应该采用其他方法?

最佳答案

你的方法似乎是正确的......

要更新和删除购物车中的商品,您可以使用以下代码:

function modifyItem(deviceId, Qty)
{
    var cart_items = $.cookie('devicelist').cartItems;

    $(cart_items).each( function(i, v) {
      if (v && v.deviceId == deviceId) {      
      cart_items[i].quantity = Qty;   
      }
    });
    var obj = { "cartItems": cart_items };
    $.cookie('devicelist', obj);
}

function deleteItem(deviceId)
{
    var cart_items = $.cookie('devicelist').cartItems;

    $(cart_items).each( function(i, v) {
      if (v && v.deviceId == deviceId) {    
      cart_items.splice(i, 1);    
      }
    });
    var obj = { "cartItems": cart_items };
    $.cookie('devicelist', obj);
} 

如何调用它们的示例:

<a href="javascript:void(0);" onClick="javascript:modifyItem(3, 5);">Modify deviceId 3</a>
<a href="javascript:void(0);" onClick="javascript:deleteItem(4);">Delete deviceId 4</a>

编辑:

根据评论中OP的要求,我修改了上述函数:

function modifyItem(deviceId, Qty)
{
    cart = $.cookie('devicelist');  
    $(cart.cartItems).each( function(i, v) {
      if (v && v.deviceId == deviceId) {
        v.quantity = Qty;
        $.cookie('devicelist', cart);
      }
    });    
}

function deleteItem(deviceId)
{
    cart = $.cookie('devicelist');  
    $(cart.cartItems).each( function(i, v) {
      if (v && v.deviceId == deviceId) {
        cart.cartItems.splice(i, 1);
        $.cookie('devicelist', cart);
      }
    }); 
}

关于javascript - 更新并删除包含购物车商品的 cookie 中的 json 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22061905/

相关文章:

javascript - Aurelia 中的导航附加 "?id=5"而不是 "/5"

javascript - "This"javascript 和 jQuery 中的关键字

javascript - 在基于 HTML5 的游戏中使用 Javascript Cookie 跟踪 HP

javascript - Nodejs Express3 使用 session 检查用户是否登录

javascript - setInterval 之后绑定(bind)不起作用

javascript - 为什么我在选择初始加载页面时出现错误?

jquery - 使用 jQuery 检测页面加载时鼠标悬停

python - 使用 JS + Python 延迟查找 facebook cookie

javascript - Jquery/Ajax - 在 HTML 中获取图片和 Youtube

jquery - 你能解释一下为什么这个 jQuery 代码有效吗?