Woocommerce 在加载时隐藏产品描述答案

【问题标题】：Woocommerce hide product description on loadWoocommerce 在加载时隐藏产品描述
【发布时间】：2016-07-31 14:31:57
【问题描述】：

我需要在产品页面中隐藏产品描述。但是当用户单击描述选项卡时，我需要显示内容。当用户再次点击时，我需要隐藏描述。它需要像 Toogle 一样工作。

但我无法完成这个。请帮忙。为了在页面加载时隐藏描述，我将以下脚本放在 single-product.php

$('.wc-tab').hide();

它正在工作。当页面加载时它被隐藏并且用户点击它会自动显示（description_tab active）。

但我需要显示隐藏每次点击。请帮忙

这是HTML结构

<ul class="tabs wc-tabs">
                            <li class="description_tab active">
                    <a href="#tab-description">Description</a>
                </li>
</ul>

谢谢。

【问题讨论】：

标签： javascript jquery css wordpress woocommerce

【解决方案1】：

单击应显示/隐藏描述的对象时使用 jQuery 切换功能。

切换功能将显示当前隐藏的元素，或隐藏当前显示的元素。

$(".wc-tabs").hide(); //start by hiding element
$("button").click(function() {
  $(".wc-tabs").toggle(); //toggle between hidden/shown when you click the button
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click Me!</button>
<ul class="tabs wc-tabs">
                            <li class="description_tab active">
                    <a href="#tab-description">Description</a>
                </li>
</ul>

【讨论】：

非常感谢您提供的代码。但是请您用给定的 html 结构检查一下。而且没有或
用户应该点击哪个元素来切换.wc-tabs？

【解决方案2】：

您可以使用 Jquery 在页面加载时隐藏选项卡内容，然后您可以在使用 Jquery 单击选项卡标题时显示它。

// 删除空标签 add_filter('woocommerce_product_tabs', 'yikes_woo_remove_empty_tabs', 20, 1);

这是一个可以删除所有空标签的函数：

add_filter( 'woocommerce_product_tabs', 'rf_woo_remove_empty_tabs', 20, 1 );
    function rf_woo_remove_empty_tabs( $tabs ) {

        if ( ! empty( $tabs ) ) {
            foreach ( $tabs as $title => $tab ) {
                if ( empty( $tab['content'] ) ) {
                    unset( $tabs[ $title ] );
                }
            }
        }
        return $tabs;
    }

如果要删除特定标签，请使用以下功能。

add_filter( 'woocommerce_product_tabs', 'rf_remove_product_tabs', 98 );

function rf_remove_product_tabs( $tabs ) {

    unset( $tabs['description'] );          // Remove the description tab
    unset( $tabs['reviews'] );          // Remove the reviews tab
    unset( $tabs['additional_information'] );   // Remove the additional information tab

    return $tabs;

}

【讨论】：