运送到其他地址复选框到单选按钮

Question

我想删除“运送到其他地址”复选框，并用“是”和“否”将其更改为单选按钮。我找不到任何方法。有什么建议吗？

<h3 id="ship-to-different-address">
    <label class="woocommerce-form__label woocommerce-form__label-for-checkbox checkbox">
        <input id="ship-to-different-address-checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> type="checkbox" name="ship_to_different_address" value="1" /> <span><?php _e( 'Ship to a different address?', 'woocommerce' ); ?></span>
    </label>
</h3>

Answer 1

您将需要编辑模板文件form-shipping.php。在该文件中，更改以下显示的代码。

<h3 class="radio-toggle">
    <span><?php _e( 'Ship to a different address?', 'woocommerce' ); ?></span>
    <label class="woocommerce-form__label woocommerce-form__label-for-radio radio" style="margin-left:15%;">
        <input id="ship-to-different-address-radio-yes" class="woocommerce-form__input woocommerce-form__input-radio input-radio" type="radio" name="ship_to_different_address_radio_toggle" value="1" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> /> <?php _e( 'Yes', 'woocommerce' ); ?>
    </label>
    <label class="woocommerce-form__label woocommerce-form__label-for-radio radio" style="margin-left:5%;">
        <input id="ship-to-different-address-radio-no" class="woocommerce-form__input woocommerce-form__input-radio input-radio" type="radio" name="ship_to_different_address_radio_toggle" value="0" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'billing' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> /> <?php _e( 'No', 'woocommerce' ); ?>
    </label>
    <span id="ship-to-different-address"><input id="ship-to-different-address-checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> type="checkbox" name="ship_to_different_address" value="1" style="opacity:0;" /></span>
</h3>

此外，将以下代码段添加到functions.php

if ( ! function_exists( 'toggle_shipping_address' ) ){
    function toggle_shipping_address(){
        global $post;
        if($post->post_name === 'checkout'){
        ?>
        <script type="text/javascript">
        jQuery(document).ready(function($){
            $('.radio-toggle .input-radio').change(function(){
                var curval = ($(this).val() === '0') ? true : false;
                $('#ship-to-different-address-checkbox').prop('checked', curval);
                $('#ship-to-different-address-checkbox').trigger('click');
            });
        });
        </script>
        <?php
        }
    }
}
add_action( 'wp_footer', 'toggle_shipping_address' );

这将导致将复选框更改为带有标签“是”和“否”的单选按钮。以下是屏幕截图，供您参考。这是与扩展和折叠送货地址表格的前一个div功能一起使用的。

希望这会有所帮助。