当 Woocommerce 购物车为空时更改元素颜色

Question

Wordpress 网站，使用 Oxygen Builder 构建。我的菜单附近有一个线性图标（购物车）。当购物车中有物品（非空）时，我正在尝试更改该图标的颜色。对于我的生活，我无法让它工作。它要么使网站崩溃，要么破坏正文边缘，等等。

我在 functions.php 中尝试了以下多种变体：

add_action('wp_footer', 'crit_cart') ;
function crit_cart() {
    if(sizeof( WC()->cart->get_cart() ) > 0 ) {
        jQuery('#fancy_icon-62-12').css('color','blue');
    }
}

和

function crit_cart() { 
if(WC()->cart->get_cart_contents_count() != 0){
        echo "<script type=text/javascript> jQuery("#link-64-12").css('color','#47beff');</script>";
}

} add_filter('wp_headers', 'crit_cart');

我已经尝试过最后一个有和没有 jQuery 之前的回声。

任何帮助将不胜感激。提前致谢！

Answer 1

您的想法是正确的，但是存在语法错误。

首先，您尝试从 PHP 运行 jQuery。 PHP运行在后端，jQuery/JS运行在前端，所以不能这样运行。

在第二个中，您做得正确 - 将脚本回显到前端以运行，但是您的第二个引用结束了您的回显，它将返回错误。试试这个：

add_action('wp_footer', 'crit_cart') ;
function crit_cart() {
    if(sizeof( WC()->cart->get_cart() ) > 0 ) : ?>

    <script type='text/javascript'>
        jQuery('#fancy_icon-62-12').css('color','blue');
    </script>
    <?php
    endif;
}

在此示例中，您正在从 PHP 中转义，并将直接将脚本回显到 DOM。由于它是一个脚本，它会在那个时候运行。

希望这会有所帮助。