在 AJAX 添加到 WooCommerce 中的购物车后更新自定义购物车计数（或任何 HTML）- PHP

当使用 WooCommerce 应用程序时，添加商品到购物车后，你可能希望实时更新购物车计数以及其它 Web 页面的内容。 在这种情况下，我们可以使用 AJAX 技术来实现此目的。通过 AJAX，我们可以在不必刷新 Web 页面的情况下与后端进行通信。

以下是一个使用 PHP 和 AJAX 更新自定义购物车计数的示例：

AJAX

首先，我们需要设置 AJAX 请求。 创建一个 JavaScript 文件，然后编写以下代码：

jQuery(document).ready(function($) {
// 处理添加到购物车按钮的点击事件
    $('body').on('click', '.add_to_cart_button', function() {
        var product_id = $(this).data('product_id');
        var quantity = $(this).data('quantity');
        // 发送 AJAX 请求
        $.ajax({
            type: 'POST',
            url: my_ajax_obj.ajax_url,
            data: {
                action: 'update_cart_count',
                product_id: product_id,
                quantity: quantity
            },
            success: function(response) {
                // 返回 HTML 响应以更新购物车计数
                $('.my-cart-count').html(response);
            }
        });
    });
});

此代码将添加到购物车按钮的点击事件处理程序与 AJAX 请求链接。通过 $ ('. My-cart-count ')，我们可以找到用于显示购物车计数的元素，然后将服务器返回的 HTML 响应分配给该元素。

PHP

现在，我们需要编写 PHP 代码来处理 AJAX 请求。在您的 WordPress 主题的 functions.php 文件中，添加以下代码：

add_action('wp_ajax_update_cart_count', 'update_cart_count_callback');
add_action('wp_ajax_nopriv_update_cart_count', 'update_cart_count_callback');
function update_cart_count_callback() {
    $product_id = sanitize_text_field($_POST['product_id']);
    $quantity = sanitize_text_field($_POST['quantity']);
    // 在购物车中增加商品
    WC()->cart->add_to_cart($product_id, $quantity);
    // 获取更新后的购物车总数
    $cart_count = WC()->cart->get_cart_contents_count();
    // 返回更新的购物车数量或其它 HTML
    echo $cart_count;
    wp_die();
}

这段代码使用 add_action 函数将 update_cart_count_callback 注册为 AJAX 功能回调函数，并将其分配给挂钩为 wp_ajax_update_cart_count 和 wp_ajax_nopriv_update_cart_count。然后，我们使用 sanitize_text_field 函数来清理 product_id 和 quantity 变量中的数据，并使用 WC()->cart->add_to_cart 将商品添加到购物车。最后，我们获取更新后的购物车数量并将其作为 HTML 标记返回给 AJAX 请求。

总结

以上代码使用 AJAX 技术实现了动态更新购物车计数的功能。用户单击“添加到购物车”按钮时，它将触发 AJAX 请求，该请求将调用 update_cart_count_callback 函数，该函数将更新购物车并通过 HTML 响应返回更新的购物车计数。