Ajax 在 Woocommerce 中更新购物车菜单上的产品数量

Ajax update product count on cart menu in Woocommerce

我有一个指向购物车的菜单项,它读取购物车中当前的产品数量。

CART (3)

当我在购物车页面上更改产品数量并单击 "Update cart" 按钮或删除项目时,该数量不会刷新。 知道为什么吗?

/*CHANGE CART MENU TITLE IN MENU*/
add_filter( 'wp_setup_nav_menu_item','my_item_setup' );
function my_item_setup($item) {

    if ( ! is_admin() ) {
        if ( class_exists( 'woocommerce' ) ) {

            global $woocommerce;

            if ( $item->url == esc_url( wc_get_cart_url() ) ) {

                if (is_null($woocommerce->cart)){

                } else {
                    if( get_locale() == 'fr_FR' ) {
                        $item->title = 'PANIER ('. '<span class="count-cart">' .  $woocommerce->cart->get_cart_contents_count() . '</span>)';
                    } else {
                        $item->title = 'MY CART ('. '<span class="count-cart">' .  $woocommerce->cart->get_cart_contents_count() . '</span>)';
                    }
                }

            }
        }
    }
    return $item;
}

add_filter( 'woocommerce_add_to_cart_fragments', 'my_woocommerce_add_to_cart_fragments' );
function my_woocommerce_add_to_cart_fragments( $fragments ) {
    // Add our fragment
    $fragments['li.menu-item-type-woocommerce-cart'] = my_item_setup( '');
    return $fragments;
}

编辑:

使用 答案代码,似乎效果更好一些。当我从购物车页面删除商品或更改商品数量时,产品编号会更新,但当我清空购物车时,它不会更新。此外,产品编号前后都有一个space(见空购物车和"CART ( 1 )"的图片。

add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_cart_fragments');
function wc_refresh_cart_fragments($fragments){
    ob_start();
    ?>
    <span class="count-cart"><?php echo WC()->cart->get_cart_contents_count(); ?></span>
    <?php
        $fragments['li a span.count-cart'] = ob_get_clean();
    return $fragments;
}

要对您的购物车查看器进行 Ajax 化,使其在添加或删除商品时更新(通过 ajax),请使用:

/**
 * Show cart contents / total Ajax
 */
add_filter( 'woocommerce_add_to_cart_fragments', 'woocommerce_header_add_to_cart_fragment' );

function woocommerce_header_add_to_cart_fragment( $fragments ) {
    global $woocommerce;

    ob_start();

    ?>
    <a class="cart-customlocation" href="<?php echo esc_url(wc_get_cart_url()); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a>
    <?php
    $fragments['a.cart-customlocation'] = ob_get_clean();
    return $fragments;
} ?>

Reference Link

已更新

最好设置标签 ID 而不是标签 CLASS 来 ajaxify 购物车计数,因为此选择器引用需要是唯一的。如果不是这样,并且有隐藏的移动重复菜单,则无法使用。

所以这个项目菜单需要在你的页面生成的 html 代码中是唯一的......如果这个菜单项目在移动版本中重复,你需要更改标签 ID 或标签 CLASS为手机码版本。

我稍微回顾了一下你的代码:

add_filter( 'wp_setup_nav_menu_item','my_item_setup' );
function my_item_setup( $item ) {
    if ( ! is_admin() && class_exists( 'woocommerce' ) ) {
        if ( $item->url == esc_url( wc_get_cart_url() ) && ! WC()->cart->is_empty() ){
            $title = get_locale() == 'fr_FR' ? 'PANIER' : 'MY CART';
            $item->title = $title . ' (<span id="count-cart-items">' .  WC()->cart->get_cart_contents_count() . '</span>)';
        }
    }
    return $item;
}

add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_cart_fragments', 50, 1 );
function wc_refresh_cart_fragments( $fragments ){
    $cart_count = WC()->cart->get_cart_contents_count();

    // Normal version
    $count_normal = '<span id="count-cart-items">' .  $cart_count . '</span>';
    $fragments['#count-cart-items'] = $count_normal;

    // Mobile version
    $count_mobile = '<span id="count-cart-itemob">' .  $cart_count . '</span>';
    $fragments['#count-cart-itemob'] = $count_mobile;

    return $fragments;
}

代码进入您的活动子主题(活动主题)的 function.php 文件。它应该更好用。