Question

我正在尝试在Shopify中制作ajaxed购物车。我已将产品页面添加到购物车而不刷新或转到购物车页面。要查看购物车，您可以点击.cart-show的输入或链接，因此我将其添加到“添加到购物车”输入中：

<input style="margin-top: 40px; width: 50%;" type="submit" value="Add to cart" class="button cart-show" onclick=" Shopify.addItemFromForm('add-item-form'); return false" />

这样做只是将项目添加到购物车并显示购物车div #menu。当然，添加新项目时购物车不会更新，问题是：我该怎么做？ 每次点击输入时如何更新购物车div #cart？如何在添加新产品时更新div＃cart-total-items中的cart.item_count？我用了一天多的时间来搞清楚这一点，但仍然没有得到任何结果。我甚至试过在Shopify论坛上询问，但它只是死了，没有帮助到那里。

添加新项目时的'Shopify.onItemAdded'脚本如下：

 Shopify.onItemAdded = function(line_item) {
    Shopify.getCart();

    refresh #menu script here

    refresh cart.item.count script  in theme.liquid could be something like this, but it doesn't work: 

    $('#cart-total-items').update(cart.item_count);
  };

cart.item_count

<span style="" id="cart-total-items"><a class="cart-show">Bag ({{ cart.item_count }})</a></span>

有什么想法吗？

Answer 1

这可能不是您需要的，但它可能有所帮助。我在我开发的shopify网站上制作并实现了一个ajax购物车。我用jquery＆amp; JSON做这种类型的东西，这就是我做的事情：

jQuery.getJSON('/cart.js', function (cart, textStatus) {
  //the cart info is in the callback. the item_count is available as part of the callback
  //below I set my cartcount div with the current cart item_count
  var carttext=cart.item_count;
  jQuery("#cartcount").text(carttext);
});

Shopify.onItemAdded更新#cart和cart.item.count

1 个答案: