如何根据Woocommerce_form_field（）选择运行一个函数？

Question

我正在从woocommerce_form_field（）中填充下拉菜单，如下所示：

// Add additional items to array 
$options = array( 
    0 => __( 'Select an option...', 'woocommerce' ),
    1 => __( 'No Compressor & Bracket ', 'woocommerce') 
    ) + $options;
    
// Add select field
woocommerce_form_field( 'compressor-options', array(
    'type'          => 'select',
    'label'         => __( 'Add Compressor & Bracket', $domain ),
    'required'      => false,
    'options'       => $options,
),'' );
echo '<p>Number of Compressor & Bracket options: ' . count( $options ) . '</p>';

我想根据用户的选择来更改主产品的SKU。我目前不知道如何这样做。

我有更改SKU的功能，但是如果用户进行选择，则不会接受。

function change_current_sku() {
    global $product;
    if ( ! isset( $POST['compressor-options'] ) ) {

        echo '<div><br></div>';
        echo $product->get_sku() . ' (EX)';

    }
}
add_action( 'woocommerce_after_add_to_cart_button', 'change_current_sku' );

有没有一种方法可以在WooCommerce_form_field上拥有onChange（）？

Answer 1

当涉及简单类型的产品时，Ajax本身并不是必需的，只有jQuery可以做到。因此，这取决于您的特定要求。

所以你得到：

function action_woocommerce_before_add_to_cart_button() {
    // Some random options
    $random_options = array( 2 => 'abc', 3 => 'def', 4 => '(ghi)', 5 => 'jkl' );
   
    // Add additional items to array 
    $options = array( 
        0 => __( 'Select an option...', 'woocommerce' ),
        1 => __( 'No Compressor & Bracket ', 'woocommerce') 
    ) + $random_options;
        
    // Add select field
    woocommerce_form_field( 'compressor-options', array(
        'type'          => 'select',
        'label'         => __( 'Add Compressor & Bracket', 'woocommerce' ),
        'required'      => false,
        'options'       => $options,
    ),'' );
    echo '<p>Number of Compressor & Bracket options: ' . count( $options ) . '</p>';

    ?>
    <script type="text/javascript">
    jQuery( function($) {
        // On change
        $( document ).on( 'change', '#compressor-options', function () {
            var suffix = $( 'option:selected', this ).text();

            // Append
            $( '.my-product-sku .sku-suffix' ).text( suffix );
        });
    });
    </script>
    <?php
}
add_action( 'woocommerce_before_add_to_cart_button', 'action_woocommerce_before_add_to_cart_button' );

function action_woocommerce_after_add_to_cart_button() {
    global $product;
    
    // Is a WC product
    if ( is_a( $product, 'WC_Product' ) ) {
        echo '<p class="my-product-sku">' . $product->get_sku() . ': ' . '<span class="sku-suffix"></p>';
    }
}
add_action( 'woocommerce_after_add_to_cart_button', 'action_woocommerce_after_add_to_cart_button', 10 );