Question

我正在使用Cartjs.org javascript。我正在尝试创建一个ajax购物车，这样您就可以将商品添加到购物车而无需进入cart.liquid页面。

有人知道这方面的好教程吗？我一直在使用Cart.js的指南，但我根本不明白该怎么做。

我的购物车ajax显示在所有页面上，并且应该在添加项目或更新项目时更新：

<div id="cart-ajax" data-cart-view>
    <form data-cart-submit="data-cart-submit">
      {{ cart.item_count }}
    {% for  line_item in cart.items %}
        <div class="wrap">
          <div class="img"><img src="{{ item | img_url: 'medium' }}" /></div>
          <div class="info">
            <h1>{{ line_item.title }}</h1>
            {{ line_item.price | money }}
            <input style="padding-left: 0px !important; width: 25px !important;" name="updates[]" class="qty" id="updates_{{ item.id }}" value="{{ line_item.quantity }}" min="0" data-id="{{ item.id }}">
            {{ line_item.line_price | money }}
            <button id="remove" data-cart-remove="{{ line_item.id }}"><i class="fa fa-trash"></i></button>
          </div>
        </div>

    {% endfor %}
        <div class="subtotal">
          <div class="left">Subtotal</div>
          <div class="right"><span rv-text="cart.total_price | money">
      {{ cart.total_price | money }}
    </span></div>
            <input type="submit" name="checkout" value="Checkout" />
        </div>
      <button id="button-double">Double my Order!</button>

<script type="text/javascript">
    $('#button-double').click(function() {
        var newQuantity = CartJS.cart.items[0].quantity * 2;
        CartJS.updateItem(1, newQuantity);
    });
</script>
      <script type="text/javascript">
    $('#remove').click(function() {
        var newQuantity = CartJS.cart.items[0].quantity = 0;
        CartJS.updateItem(1, newQuantity);
    });
</script>


</form>

</div>

如何在没有正常需要的表格的情况下制作添加到购物车按钮？

Shopify Cart.JS不能添加到购物车而不去cart.liquid

0 个答案: