根据 WooCommerce 产品类型显示或隐藏管理员自定义设置字段

Question

我制作了自定义字段后端，我希望为简单的产品类型显示它并为其他类型隐藏。我认为很少有不足以让我实现它。我将不胜感激。谢谢！ 我添加的代码是：

add_action('admin_head', 'show_this_for_simple_products_and_hide_for_others');
function show_this_for_simple_products_and_hide_for_others() {  
?> 
<script>
    jQuery( function($){

    $( 'body' ).on( 'woocommerce-product-type-change', function( event, select_val, select ) {

        if ( select_val === 'simple' ) {
             // modify to an actual CSS class selector
            $( '.p.form-field.final_product_sku_field' ).show();
        }

    } );

    $( 'select#product-type' ).change();

} );
</script>
<?php
}

Answer 1

更新

您不需要这样做，因为已经有一些 CSS 类选择器允许这样做。

要显示“简单”产品类型的字段，您需要在自定义设置字段之间添加 （在您的函数内部）：

echo '<div class="show_if_simple hidden">';

// Your fields here (for "simple" products type only)

echo '</div >';

您可以使用show_if_{$product_type} 或hide_if_{$product_type} 复合类选择器，根据产品类型显示或隐藏自定义设置产品字段（其中{$product_type} 需要替换按目标产品类型）。

它适用于所有自定义产品类型。

类选择器hidden 指定内容为隐藏，以便显示未指定的产品类型。

您还可以使用其他类选择器，例如 show_if_virtual、hide_if_virtual、show_if_downloadable 和 hide_if_downloadable。

类选择器options_group添加了一条分隔线。

这是一个示例（仅针对简单产品显示该字段）：

add_action( 'woocommerce_product_options_sku', 'add_product_final_sku_custom_field' );
function add_product_final_sku_custom_field(){
    global $post, $product_object;

    echo '<div class="show_if_simple hidden">';

    woocommerce_wp_text_input( array(
        'label' => __( 'Final SKU', 'woocommerce' ),
        'placeholder' => __( 'Enter final SKU here', 'woocommerce' ),
        'id' => 'final_sku',
        'desc_tip' => true,
        'description' => __( 'This SKU is for final use only.', 'woocommerce' ),
    ) );

    echo '</div>';
}

代码位于活动子主题（或活动主题）的functions.php 文件中。经过测试并且可以工作。

您可以看到 on the related core html files code source 在管理单个产品页面上显示 WooCommerce 产品设置字段。