Question

我在WooCommerce购物车页面上放置了一些自定义元素。当产品在购物车中时，页面看起来不错–但是，当购物车为空时，我的自定义元素仍然存在，并且会干扰购物车的空布局。这就是为什么我要在那种情况下隐藏那些自定义元素的原因。

我通过将以下代码添加到子主题的函数中来进行尝试：

add_action( 'wp_footer', 'henju_empty_cart' );
function henju_empty_cart() {

    if ( WC()->cart->get_cart_contents_count() == 0 ) {
            echo "<script>
            $('Have-Question-Textblock-Cart-0209').hide()
            </script>";
    }
}

或者：

add_action( 'wp_head', 'henju2_empty_cart' );
function henju2_empty_cart() {

    if( is_cart() && WC()->cart->cart_contents_count == 0){
            echo "<script>
            $('Have-Question-Textblock-Cart-0209').css('display','none');
            </script>";
exit;
    }
}

但这没用。

基本上，我想隐藏具有CSS类“ .Have-Question-Textblock-Cart-0209”的自定义元素。

有人知道怎么做吗？

谢谢，最好！

Answer 1

好的，我想我找到了一种无需手动重新加载页面即可解决的解决方案：

add_filter( 'body_class','henju_empty_cart' );
function henju_empty_cart( $classes ) {
    global $woocommerce;
    if( is_cart() && WC()->cart->get_cart_contents_count() == 0 ) {
        $classes[] = 'Empty-Cart-0209';
    }

    return $classes;

}

add_action( 'wp_footer', 'henju_empty_cart_ajax' ); 

function henju_empty_cart_ajax() { 
   if ( is_cart()) {
      ?> 
      <script type="text/javascript"> 
         jQuery(function($) {
               if ($num_items == 0) { location.reload (true) };
         });
         exit();
      </script> 
      <?php 
   } 
}

并在style.css中：

.Empty-Cart-0209 .Have-Question-Textblock-Cart-0209 {
display:none;
}

WooCommerce，购物车页面–购物车为空时隐藏元素

1 个答案: