ajax - Woocommerce 中未从购物车中删除的最后一项

Question

我无法从购物车中移除最后一件商品。我将几个产品添加到购物车 - 删除所有项目，但最后一个不是。 Ajax 工作，显示产品已从购物车中删除的消息，但在视觉上 - 它并没有消失。刷新页面后，购物车是空的。

Answer 1

我在我们的一个网站上遇到了同样的问题。我一直在关注 /woocommerce/assets/js/frontend/cart.js 中的 javascript我注意到有以下代码行 $( '.woocommerce-cart-form__contents' ).closest( '.woocommerce' ).replaceWith( $cart_html );它替换了购物车页面中的所有购物车内容。

很可能您已经覆盖了默认的 woocommerce 购物车模板并删除了类 .woocommerce-cart-form__contents来自您的自定义模板，因此 html 不能被 javascript 替换。

您有 2 个选项可以解决此问题:

选项 1:
尝试包含 .woocommerce-cart-form__contents在您的 cart.php模板

选项 2:
如果您不想添加该类，woocommerce 会触发 javascript 事件 wc_cart_emptied当购物车被清空时。因此，您可以在主题的 javascript 中使用以下代码来确保在触发时清空购物车页面中的 DOM 元素:

    /**
     * When Cart has been emptied we need to make sure that cart form and cart collaterals in /cart page are removed.
     *
     * @param {Event} e
     */
    function cartEmptied(e) {
        //The below 2 elements can be changed according to the classes you use in your custom cart template
        var cartForm = $('.woocommerce-cart-form');
        var cartCollaterals = $('.cart-collaterals');

        if (cartForm.length > 0) {
            cartForm.remove();
        }

        if (cartCollaterals.length > 0) {
            cartCollaterals.remove();
        }
    }
    $(document.body).on('wc_cart_emptied', cartEmptied);