选择秘鲁以外国家时隐藏WooCommerce结账字段问题求助

你的问题出在原代码只监听了运费方式的单选框变化，但切换国家时WooCommerce会重新渲染运费选项，原有监听没触发，且页面初始化时也没执行字段状态判断，导致必须刷新才生效。下面是修正后的代码，直接替换你现有Code Snippets里的内容即可：

// 动态设置结账字段属性
add_filter( 'woocommerce_checkout_fields', 'hide_fields_for_non_peru_countries' );
function hide_fields_for_non_peru_countries( $fields ) {
    $target_shipping_method = 'flat_rate:3';
    $hide_fields = array( 'billing_id', 'billing_address_2', 'billing_reference' );

    $chosen_shipping_methods = WC()->session->get( 'chosen_shipping_methods' );
    $chosen_shipping = !empty($chosen_shipping_methods) ? $chosen_shipping_methods[0] : '';

    foreach( $hide_fields as $field ) {
        // 标记字段为动态控制类
        $fields['billing'][$field]['class'][] = 'billing-dynamic-field';
        
        // 如果选中目标运费方式，设置字段非必填并添加隐藏类
        if ( $chosen_shipping === $target_shipping_method ) {
            $fields['billing'][$field]['required'] = false;
            $fields['billing'][$field]['class'][] = 'hide-field';
        }
    }
    return $fields;
}

// 添加前端样式与动态控制脚本
add_action( 'wp_footer', 'dynamic_checkout_fields_script', 999 );
function dynamic_checkout_fields_script() {
    if ( !is_checkout() || is_wc_endpoint_url() ) return;
    ?>
    <style>
        .hide-field { display: none !important; }
    </style>
    <script>
        jQuery( function( $ ) {
            // 定义控制字段显示/隐藏的函数
            function toggleBillingFields() {
                const targetMethod = 'flat_rate:3';
                const chosenMethod = $('#shipping_method input[type="radio"]:checked').val();
                
                $('.billing-dynamic-field').toggleClass('hide-field', chosenMethod === targetMethod);
            }

            // 页面初始化时执行一次，确保初始状态正确
            toggleBillingFields();

            // 监听运费方式切换
            $(document).on('change', '#shipping_method input[type="radio"]', toggleBillingFields);

            // 监听国家选择框变化（切换国家会刷新运费，之后重新检查字段）
            $(document).on('change', '#billing_country, #shipping_country', function() {
                // 延迟执行，确保WooCommerce完成运费重新加载
                setTimeout(toggleBillingFields, 500);
            });

            // 监听WooCommerce运费更新事件（更可靠的触发时机）
            $(document.body).on('updated_shipping_method', toggleBillingFields);
        });
    </script>
    <?php
}

关键改动说明： #

• 初始化执行：页面加载时自动检查当前选中的运费方式，设置字段初始状态，不用手动刷新
• 监听国家切换：绑定了账单/收货国家选择框的变化事件，切换国家后延迟执行字段判断，确保运费选项已更新
• 监听官方事件：监听WooCommerce的updated_shipping_method事件，这是运费更新完成后的官方触发点，比延迟更可靠
• 代码结构优化：把字段控制逻辑封装成函数，避免重复代码，维护更方便

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