WP-WooCo产品对比按钮求助：点击隐藏需求及get_session_cookie报错

嘿，我来帮你搞定这两个问题——按钮点击后自动隐藏，还有那个「Uncaught Error: Call to a member function get_session_cookie() on null」的报错！咱们一步一步来：

先解决会话错误：「get_session_cookie() on null」 #

这个报错的核心原因是：你的代码在调用WooCommerce会话对象的时候，会话还没被正确初始化。简单说就是WC()->session是个null，所以调用它的方法就炸了。

修复步骤： #

1. 确保会话初始化：在你的产品对比逻辑代码里（不管是主题functions.php还是自定义插件），先加一段代码确保会话已经启动：

// 检查并初始化WooCommerce会话
if ( ! WC()->session || ! WC()->session->has_session() ) {
    WC()->session->set_customer_session_cookie( true );
}

2. 挂对钩子：别在太早的钩子（比如init之前）执行对比逻辑，建议把你的对比功能挂在woocommerce_init钩子上——这个钩子会等WooCommerce完全加载好再触发：

add_action( 'woocommerce_init', 'custom_product_compare_handler' );
function custom_product_compare_handler() {
    // 这里放你的产品对比添加、处理代码
}

再实现按钮点击后隐藏的效果 #

这个是前端的小功能，用JavaScript就能搞定，分两种情况：

情况1：按钮是静态加载的（比如普通产品页面的按钮） #

直接在主题的自定义JS文件（比如assets/js/custom.js）里加这段代码：

document.addEventListener('DOMContentLoaded', function() {
    // 找到所有对比按钮，替换成你实际的按钮类名
    const compareBtns = document.querySelectorAll('.add-to-compare');
    
    compareBtns.forEach(btn => {
        btn.addEventListener('click', function() {
            // 点击后直接隐藏按钮
            this.style.display = 'none';
            
            // 可选：加个"已添加到对比"的提示
            const tip = document.createElement('span');
            tip.textContent = '已添加到对比列表';
            tip.style.cssText = 'color: green; margin-left: 10px;';
            this.parentNode.appendChild(tip);
            
            // 3秒后自动消失提示
            setTimeout(() => tip.remove(), 3000);
        });
    });
});

情况2：按钮是动态加载的（比如无限滚动加载的产品） #

如果按钮是后来通过AJAX加载的，上面的事件绑定会失效，这时候用事件委托：

document.addEventListener('DOMContentLoaded', function() {
    // 把事件绑定到父元素（比如body），监听子按钮的点击
    document.body.addEventListener('click', function(e) {
        if (e.target.classList.contains('add-to-compare')) {
            e.target.style.display = 'none';
            
            // 同样可以加提示逻辑
            const tip = document.createElement('span');
            tip.textContent = '已添加到对比列表';
            tip.style.cssText = 'color: green; margin-left: 10px;';
            e.target.parentNode.appendChild(tip);
            setTimeout(() => tip.remove(), 3000);
        }
    });
});

怎么把JS加到WordPress里？ #

如果不想直接改主题文件，也可以通过PHP注册脚本：
在functions.php里加这段：

add_action( 'wp_enqueue_scripts', 'load_compare_btn_script' );
function load_compare_btn_script() {
    wp_enqueue_script(
        'compare-btn-hide',
        get_stylesheet_directory_uri() . '/assets/js/compare-btn-hide.js',
        array('jquery'), // 依赖jQuery，如果不需要可以去掉
        '1.0',
        true // 放在页面底部加载，更高效
    );
}

然后把上面的JS代码存到主题目录/assets/js/compare-btn-hide.js里就行。

最后检查一下 #

先测试会话错误：刷新产品页面，看看控制台还会不会出现那个报错；然后测试按钮点击，看是不是点击后就隐藏了。如果还有问题，记得检查按钮的类名是不是和代码里的一致，还有对比逻辑里的会话初始化有没有生效。

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