基于单选按钮选择的woocommerce结帐条件字段答案

【问题标题】：woocommerce checkout conditional fields based on radio buttons choices基于单选按钮选择的woocommerce结帐条件字段
【发布时间】：2018-10-14 13:59:24
【问题描述】：

在我的 wordpress 网站中，我需要在 woocommerce 结帐页面中添加一些条件字段。

我已经创建了 2 个字段，现在我需要根据对另一个字段所做的选择来显示一个字段。

字段名称（父字段）：billing_checkbox_cf
字段二的名称：billing_cf_in

基于“WooCommerce conditional custom checkout fields”回答线程，这是我的代码：

add_action( 'woocommerce_after_checkout_form', 'cbi_cf_conditionally_hide_show', 6);
function cbi_cf_conditionally_hide_show() {
    // if ( ICL_LANGUAGE_CODE !='it' ) return; // Only for Italy
    $required = esc_attr__( 'required', 'woocommerce' );
    ?>
    <script type="text/javascript">
        (function($){
            var required = '<abbr class="required" title="<?php echo $required; ?>">*</abbr>'; // Required html

            $('#billing_cf_in_field').hide();

            $('input#billing_checkbox_cf').change(function(){
                if (this.checked) {
                    $('#billing_cf_in_field').fadeIn("fast", function(){
                        $(this).addClass("validate-required");
                        $('#billing_cf_in_field > label').append(required);
                    });
                } else {
                    $('#billing_cf_in_field').fadeOut("fast", function(){
                        $(this).removeClass("validate-required");
                        $('#billing_cf_in_field > label > .required').remove();
                    });
                }
                $('#billing_cf_in_field').val('');
                $('#billing_cf_in_field').removeClass("woocommerce-validated");
                $('#billing_cf_in_field').removeClass("woocommerce-invalid woocommerce-invalid-required-field");
            });
        })(jQuery);
    </script>
    <?php
}

到目前为止，如果 Field1 "billing_checkbox_cf" 是一个复选框，我就可以让它工作。当Field1被勾选时，我可以让Field2显示出来。

我想让 Field1 成为单选按钮 (option1|option2|option3) 并使其仅在用户选择 option2 时才显示 Field2。

但我不是程序员，我无法处理单选按钮条件。如何修改我的代码以使其正常工作？

【问题讨论】：

标签： php jquery woocommerce

【解决方案1】：

我已经成功了。我在这里发帖以防对其他人有用

add_action( 'woocommerce_after_checkout_form', 'cbi_cf_conditionally_hide_show', 6);
function cbi_cf_conditionally_hide_show() {
    // if ( ICL_LANGUAGE_CODE !='it' ) return; // Only for Italy
    $required = esc_attr__( 'required', 'woocommerce' );
    ?>
    <script type="text/javascript">
        (function($){
            var required = '<abbr class="required" title="<?php echo $required; ?>">*</abbr>'; // Required html

            $('#billing_cf_in_field').hide();

            $('input[type=radio][name=billing_radiobox_cf]').change(function(){
                if (this.value === 'option2') {
                    $('#billing_cf_in_field').fadeIn("fast", function(){
                        $(this).addClass("validate-required");
                        $('#billing_cf_in_field > label').append(required);
                    });
                } else {
                    $('#billing_cf_in_field').fadeOut("fast", function(){
                        $(this).removeClass("validate-required");
                        $('#billing_cf_in_field > label > .required').remove();
                    });
                }
                $('#billing_cf_in_field').val('');
                $('#billing_cf_in_field').removeClass("woocommerce-validated");
                $('#billing_cf_in_field').removeClass("woocommerce-invalid woocommerce-invalid-required-field");
            });
        })(jQuery);
    </script>
    <?php
}

不幸的是，验证没有完全起作用，因为在发送表单时，如果 billing_cf_in_field 未填写，该字段将正确变为红色，但错误消息未提及要填写的字段列表中的 billing_cf_in_field。我将为此打开另一个线程。

【讨论】：