Shopify 使用 AJAX 更新 cart.item_count答案

【问题标题】：Shopify update cart.item_count using AJAXShopify 使用 AJAX 更新 cart.item_count
【发布时间】：2013-06-30 06:05:36
【问题描述】：

在我的Shopify 网站的产品详细信息页面上，当您单击“Add To Cart”时，该页面使用AJAX 执行其操作。但是有一个名为cart.item_count 的变量不会更新，除非页面刷新。

问题：如何让 AJAX 更新该页面上的 cart.item_count。

以下是 HTML 页面的代码：

        <div id="mini-cart" >

            <span class="cart_count_info">Cart ({{ cart.item_count }})</span>//THIS SPAN IS WHAT NEEDS TO BE UPDATED 

        </div>

         <p id="add-to-cart-msg"></p> //THIS "P" IS UPDATED BY THE AJAX WITH MESSAGING SEE BELOW JAVASCRIPT

          <form action="/cart/add" method="post" class="variants" id="product-actions" enctype="multipart/form-data">
              //TOOK OUT SOME OF THE FORM DATA THAT IS NOT NEED FOR THIS EXAMPLE

          </form>

JavaScript 代码。 底部有一行代码可以更新同一页面上的一些副本...如果我可以更新已在他的页面上找到的 cart.item_count 变量。

function addToCartSuccess (jqXHR, textStatus, errorThrown){

  $.ajax({
    type: 'GET',
    url: '/cart.js',
    async: false,
    cache: false,
    dataType: 'json',
    success: updateCartDesc
  });
  $('#add-to-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out &raquo;</a>').fadeIn();

$('span#cart_count_info').load(Cart ({{ cart.item_count }})); 
//MAYBE HERE IS WHERE I CAN ADD MY CODE TO UPDATE THE VARIABLE I NEED. MY CODE IS JUST A GUESS SINCE ID DON'T DO MUCH JAVASCRIPT PROGRAMMING.


}

【问题讨论】：

标签： javascript html ajax shopify

【解决方案1】：

删除

$('span#cart_count_info').load(Cart ({{ cart.item_count }}));

并将其替换为下面的“UpdateCartDesc”功能（请参阅您的成功消息）

function updateCartDesc(data){
  var $cartLinkText = $('.cart_count_info').html(data.item_count);
}

【讨论】：

【解决方案2】：

当您单击添加到购物车时，将其作为与标题相关的标题，您将获得购物车中更新的产品数量。

只需将类 cart-count 添加到 div。你的结构应该是这样的：

#pageheader > .cart-summary > .cart-count

【讨论】：