解决Woocommerce AJAX加购时，购物车达标未触发Sweet Alert的问题

首先咱们梳理下你当前代码的核心问题：

• 你的PHP逻辑是页面加载时执行的，只有刷新页面才会重新判断购物车数量；而AJAX添加商品后页面没有刷新，这段PHP不会重新运行，自然没法触发弹窗。
• 你写的ajaxComplete代码有语法错误，url: '/?wc-ajax=add_to_cart'这种写法不符合jQuery事件回调的规范，没法正确匹配目标AJAX请求。

下面给你两种可行的解决方案，推荐第一种，因为更贴合WooCommerce的原生事件体系：

方案一：使用WooCommerce原生added_to_cart事件 #

WooCommerce在AJAX添加商品到购物车成功后，会触发added_to_cart这个JS事件，咱们可以直接监听这个事件，再在回调里检查最新的购物车数量：

add_action( 'wp_footer', 'trigger_popup' );
function trigger_popup() {
    // 只在前端页面加载，后台不执行
    if ( is_admin() ) return;
?>
<script src="https://unpkg.com/sweetalert2@7.20.1/dist/sweetalert2.all.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
    const maximumNumProducts = 2;

    // 监听商品添加到购物车的AJAX成功事件
    $(document).on('added_to_cart', function() {
        // 通过自定义AJAX接口获取最新购物车数量
        $.get('<?php echo admin_url('admin-ajax.php'); ?>?action=get_cart_count', function(response) {
            const cartNumProducts = parseInt(response);
            if (cartNumProducts > maximumNumProducts) {
                swal('You added all the items!', 'Proceed to checkout?', 'success');
            }
        });
    });

    // 保留页面加载时的初始检查逻辑
    const initialCartCount = <?php echo WC()->cart->get_cart_contents_count(); ?>;
    if (initialCartCount > maximumNumProducts) {
        swal('You added all the items!', 'Proceed to checkout?', 'success');
    }
});
</script>
<?php
}

// 新增AJAX接口，用于前端获取实时购物车数量
add_action('wp_ajax_get_cart_count', 'get_cart_count');
add_action('wp_ajax_nopriv_get_cart_count', 'get_cart_count');
function get_cart_count() {
    echo WC()->cart->get_cart_contents_count();
    wp_die();
}

代码说明： #

1. 新增get_cart_count AJAX接口：因为AJAX添加商品后，购物车数量在后端已更新，但前端无法直接获取最新值，需要通过这个接口同步。
2. 监听added_to_cart事件：精准捕捉WooCommerce的AJAX添加商品动作，避免全局AJAX事件的冗余判断。
3. 保留初始检查：确保页面刷新时，若购物车数量达标仍能触发弹窗。

方案二：修正全局ajaxComplete写法 #

如果你更倾向于用全局AJAX事件，需要修正语法错误，同时在回调里判断请求URL并获取最新购物车数量：

add_action( 'wp_footer', 'trigger_popup' );
function trigger_popup() {
    if ( is_admin() ) return;
?>
<script src="https://unpkg.com/sweetalert2@7.20.1/dist/sweetalert2.all.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
    const maximumNumProducts = 2;

    // 全局AJAX完成事件监听
    $(document).ajaxComplete(function(event, xhr, settings) {
        // 判断当前请求是否为添加到购物车的AJAX请求
        if (settings.url.includes('wc-ajax=add_to_cart')) {
            // 获取最新购物车数量
            $.get('<?php echo admin_url('admin-ajax.php'); ?>?action=get_cart_count', function(response) {
                const cartNumProducts = parseInt(response);
                if (cartNumProducts > maximumNumProducts) {
                    swal('You added all the items!', 'Proceed to checkout?', 'success');
                }
            });
        }
    });

    // 页面加载时的初始检查
    const initialCartCount = <?php echo WC()->cart->get_cart_contents_count(); ?>;
    if (initialCartCount > maximumNumProducts) {
        swal('You added all the items!', 'Proceed to checkout?', 'success');
    }
});
</script>
<?php
}

// 同样需要这个AJAX接口来获取实时购物车数量
add_action('wp_ajax_get_cart_count', 'get_cart_count');
add_action('wp_ajax_nopriv_get_cart_count', 'get_cart_count');
function get_cart_count() {
    echo WC()->cart->get_cart_contents_count();
    wp_die();
}

原代码问题解析： #

你之前直接在ajaxComplete回调里写url: '/?wc-ajax=add_to_cart'是语法错误，正确的做法是通过回调参数里的settings.url来判断当前请求是否匹配目标URL。另外，必须通过AJAX获取最新购物车数量，因为页面加载时的$cart_num_products是静态值，AJAX操作后不会自动更新。

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