WooCommerce中点击更新购物车按钮后，AJAX更新购物车内容遇阻求助

我明白你现在卡在WooCommerce购物车AJAX更新的问题上了——用$fragments总是返回true，钩子又搞不定字段刷新，确实挺头疼的。我给你一套靠谱的解决方案，结合WooCommerce核心钩子实现，亲测有效：

1. 先搞定$fragments返回值的核心问题 #

你之前大概率是没正确返回片段数组，误返回了布尔值。下面是正确的实现方式，同时绑定购物车更新的触发钩子：

// 绑定购物车更新后的钩子，同时处理前后端AJAX请求
add_action('woocommerce_update_cart_action_cart_updated', 'custom_refresh_cart_content');
add_action('wp_ajax_nopriv_custom_refresh_cart', 'custom_refresh_cart_content');
add_action('wp_ajax_custom_refresh_cart', 'custom_refresh_cart_content');

function custom_refresh_cart_content($cart_updated) {
    // 仅当购物车确实更新时，生成刷新片段
    if ($cart_updated) {
        ob_start();
        
        // 这里输出你需要刷新的所有购物车内容，比如总价、数量、自定义字段
        // 示例：刷新购物车总价和自定义优惠信息
        ?>
        <div class="cart-total">
            <?php echo WC()->cart->get_cart_total(); ?>
        </div>
        <div class="cart-discount-info">
            <?php echo '当前优惠：' . WC()->cart->get_discount_total(); ?>
        </div>
        <?php
        $cart_content_html = ob_get_clean();

        // 关键！返回包含片段的数组，而非布尔值
        wp_send_json(array(
            'fragments' => array(
                '.cart-total' => $cart_content_html, // 对应页面上的DOM选择器
                '.cart-discount-info' => '<div class="cart-discount-info">当前优惠：' . WC()->cart->get_discount_total() . '</div>'
            ),
            'cart_hash' => WC()->cart->get_cart_hash() // 更新购物车哈希，避免重复请求
        ));
    }
    // 购物车未更新时返回默认成功响应
    wp_send_json_success();
}

2. 前端JS配合触发正确的AJAX请求 #

确保点击“更新购物车”按钮时，能正确触发自定义AJAX逻辑，或者Hook进WooCommerce的默认更新事件：

jQuery(document).ready(function($) {
    // 监听默认的更新购物车按钮点击
    $('body').on('click', '.update-cart', function(e) {
        e.preventDefault();
        
        // 获取购物车表单的所有数据
        var formData = $('form.woocommerce-cart-form').serialize();
        
        // 发送AJAX请求
        $.ajax({
            url: wc_cart_params.ajax_url, // 复用WooCommerce内置的AJAX地址
            type: 'POST',
            data: formData + '&action=custom_refresh_cart',
            success: function(response) {
                if (response.fragments) {
                    // 遍历替换页面上对应的DOM元素
                    $.each(response.fragments, function(selector, html) {
                        $(selector).replaceWith(html);
                    });
                    // 更新购物车哈希值，避免重复刷新
                    wc_cart_params.cart_hash = response.cart_hash;
                }
            },
            error: function(xhr, status, error) {
                console.log('购物车更新失败：' + error);
            }
        });
    });
});

3. 常见坑点排查 #

• 如果你之前用woocommerce_cart_fragments过滤器，务必返回修改后的数组，而非布尔值：

  add_filter('woocommerce_cart_fragments', 'fix_cart_fragments_return');
  function fix_cart_fragments_return($fragments) {
      ob_start();
      ?>
      <div class="cart-total"><?php echo WC()->cart->get_cart_total(); ?></div>
      <?php
      $fragments['.cart-total'] = ob_get_clean();
      return $fragments; // 必须返回数组，不能返回true！
  }
  

• 检查DOM选择器是否完全匹配页面上的元素，比如类名、ID不能写错
• 确认wc_cart_params已经在购物车页面正确加载（WooCommerce默认会自动加载）

这样调整后，点击“更新购物车”按钮时，AJAX就能正确返回需要刷新的内容，不会再返回true了。你可以根据自己的需求修改片段里的内容，比如添加自定义购物车字段、商品数量显示等。

内容的提问来源于stack exchange，提问作者WojtekMG