Question

我正在一个项目中，我的目标是用WooCommerce中包含的“迷你购物车”功能替换WooCommerce WordPress网站的/ cart页面。

我更新了迷你购物车，以显示产品的添加，并允许通过AJAX移除产品以及添加和移除优惠券。

我列表中的最后2个项目是在单击包含的“更新购物车”按钮时通过AJAX更新数量，以及在删除项目，添加或删除优惠券或无效的优惠券时显示“通知”被尝试。

但是，在这一点上，我无法弄清楚如何有效地做这两种事情。

作为参考，这是我从微型购物车中删除物品所需要的一些代码。老实说，我不确定这是否是最有效的方法，但似乎可行。但是，它不会显示有关已删除项目的任何通知（尽管在标准/ cart页面上，它会显示，但我知道它没有为此使用相同的代码）。

(function ($) {
jQuery(document).on('click', '#slide-out-mini-cart .slide-out-remove', function (e) {

var $thisbutton = $(this),
  $form = $thisbutton.closest('form.woocommerce-cart-form'),
  product_id = $thisbutton.data( "product_id" ),
  cart_item_key = $thisbutton.data("cart_item_key");

if (product_id) {

  e.preventDefault();

  var data = {
    'product_id': product_id,
    'cart_item_key': cart_item_key
  };

  jQuery(document.body).trigger('remove_from_cart', [$thisbutton, data]);

  $.ajax({
    type: 'POST',
    url: woocommerce_params.wc_ajax_url.toString().replace('%%endpoint%%', 'remove_from_cart'),
    data: data,
    beforeSend: function (response) {
      $thisbutton.removeClass('added').addClass('loading');
    },
    complete: function (response) {
      $thisbutton.addClass('added').removeClass('loading');
    },
    success: function (response) {                  
      if (response.error & response.product_url) {
        window.location = response.product_url;
        return;
      }
      jQuery(document.body).trigger('removed_from_cart', [response.fragments, response.cart_hash, $thisbutton]);
    },
  });
  return false;
}       
});
})(jQuery);

我意识到这是一系列广泛的问题，但是在这一点上，我想知道：

这是完成这些动作的最有效方法吗？
如何显示“通知”？
是否可以使用类似的脚本通过AJAX更新微型购物车的数量？

很高兴提供更多详细信息，但是老实说，不确定从哪里开始，所以暂时将其留在这里。谢谢！

如何通过AJAX更新WooCommerce迷你购物车中的数量？

0 个答案: