如何适配代码实现Woocommerce按不同配送方式移除指定结账字段

现有代码错误点 #

• JS代码存在拼写错误：flar_rate:7 应为 flat_rate:7，导致匹配不到对应配送方式
• PHP逻辑存在缺陷：未处理$hide_fields未定义的场景，当选中的配送方式不在你设定的两个值范围内时，foreach循环会抛出警告，同时原有逻辑判断冗余
• JS逻辑不符合需求：你要求不同配送方式隐藏不同字段，但现有JS只做了统一显示/隐藏所有动态字段，没有区分不同配送方式的隐藏规则
• 缺少国家切换后的更新触发逻辑：WooCommerce切换国家后会刷新配送方式，但不会触发你写的配送方式change事件，所以字段状态不会自动更新

修复后PHP代码 #

add_filter( 'woocommerce_checkout_fields', 'xa_remove_billing_checkout_fields' );
function xa_remove_billing_checkout_fields( $fields ) {
    // 先定义所有需要动态控制的字段
    $all_dynamic_fields = [ 'billing_address_2', 'billing_city', 'billing_state', 'billing_postcode' ];
    $chosen_methods = WC()->session->get( 'chosen_shipping_methods' );
    $chosen_shipping = empty($chosen_methods) ? '' : $chosen_methods[0];
    $hide_fields = [];

    // 按配送方式设置要隐藏的字段
    if ($chosen_shipping == 'flat_rate:13') {
        $hide_fields = [ 'billing_address_2', 'billing_city', 'billing_state', 'billing_postcode' ];
    } elseif ($chosen_shipping =='flat_rate:7') {
        $hide_fields = [ 'billing_city', 'billing_state', 'billing_postcode' ];
    }

    // 统一处理字段属性
    foreach($all_dynamic_fields as $field ) {
        $fields['billing'][$field]['class'][] = 'billing-dynamic';
        if (in_array($field, $hide_fields)) {
            $fields['billing'][$field]['required'] = false;
            $fields['billing'][$field]['class'][] = 'hide';
        }
    }
    return $fields;
}

修复后页脚代码 #

add_action( 'wp_footer', 'cart_update_script', 999 );
function cart_update_script() {
    if (is_checkout()) :
    ?>
    <style>
        .hide {display: none!important;}
    </style>
    <script>
        jQuery( function( $ ) {
            if ( typeof woocommerce_params === 'undefined' ) {
                return false;
            }

            // 定义不同配送方式对应的隐藏字段规则
            const shippingFieldRules = {
                'flat_rate:7': ['billing_city', 'billing_state', 'billing_postcode'],
                'flat_rate:13': ['billing_address_2', 'billing_city', 'billing_state', 'billing_postcode']
            };

            // 字段状态更新公共函数
            function updateBillingFields() {
                const currentShipping = $('#shipping_method input[type="radio"]:checked').val();
                // 先重置所有字段为显示状态
                $('.billing-dynamic').removeClass('hide');
                // 匹配规则隐藏对应字段
                if (shippingFieldRules[currentShipping]) {
                    shippingFieldRules[currentShipping].forEach(field => {
                        $(`#${field}_field`).addClass('hide');
                    });
                }
            }

            // 配送方式切换时触发更新
            $(document).on( 'change', '#shipping_method input[type="radio"]', updateBillingFields);
            // 监听WooCommerce结账更新事件，切换国家/地址后自动更新字段状态
            $(document.body).on('updated_checkout', updateBillingFields);
            // 页面加载完成后初始化一次字段状态
            updateBillingFields();
        });
    </script>
    <?php
    endif;
}

注意事项 #

• 如果后续修改了配送方式的ID，需要同步更新shippingFieldRules里的键名和PHP中的判断条件
• 测试时请清空浏览器缓存和WooCommerce缓存，避免旧代码影响效果

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