显示根据 WooCommerce 单变量产品中的数量计算的小计

Question

我找到了以下代码，它根据 WooCommerce 单一产品的数量计算小计：

add_action( 'woocommerce_after_add_to_cart_button', 'bbloomer_product_price_recalculate' );
function bbloomer_product_price_recalculate() {
   global $product;
   echo '<div id="subtot" style="display:inline-block;">Total: <span></span></div>';
   $price = $product->get_price();
   $currency = get_woocommerce_currency_symbol();
   wc_enqueue_js( "     
      $('[name=quantity]').on('input change', function() { 
         var qty = $(this).val();
         var price = '" . esc_js( $price ) . "';
         var price_string = (price*qty).toFixed(2);
         $('#subtot > span').html('" . esc_js( $currency ) . "'+price_string);
      }).change();
   " );
}

但是，它仅适用于简单产品，不适用于可变产品的产品变体。我需要帮助修改代码以准确计算不同产品的小计。

下面，我对代码进行了一些更改，以处理可变产品的选定产品变体：

add_action( 'woocommerce_after_add_to_cart_button', 'bbloomer_product_price_recalculate' );
function bbloomer_product_price_recalculate() {
   global $product;

   // Check if the product is variable or not
   if ( $product->is_type( 'variable' ) ) {
       // For variable products, get the default variation price
       $default_variation = $product->get_default_attributes();
       $variation_id = $product->get_matching_variation( $default_variation );
       $variation = wc_get_product( $variation_id );
       $price = $variation->get_price();
   } else {
       // For simple products, get the regular price
       $price = $product->get_price();
   }

   echo '<div id="subtot" style="display:inline-block;">Total: <span></span></div>';
   $currency = get_woocommerce_currency_symbol();
   wc_enqueue_js( "     
      $('[name=quantity]').on('input change', function() { 
         var qty = $(this).val();
         var price = '" . esc_js( $price ) . "';
         var price_string = (price*qty).toFixed(2);
         $('#subtot > span').html('" . esc_js( $currency ) . "'+price_string);
      }).change();
   " );
}

但是它不起作用。如何让它也适用于可变产品？

Answer 1

要显示简单和可变产品的格式化产品小计，请使用以下命令：

add_action( 'woocommerce_after_add_to_cart_button', 'display_product_subtotal_html' );
function display_product_subtotal_html() {
    global $product;

    $price    = wc_get_price_to_display( $product );
    $currency = get_woocommerce_currency_symbol();
    $variable = $product->is_type('variable');

    echo '<div id="subtot" style="display:inline-block;">Total: <span></span></div>';

    if ( $product->is_type('variable') )
    wc_enqueue_js("var qty = 1, price = 0, subtotal = 0;  
    $('[name=quantity]').on('input change', function() { 
        qty = $(this).val();
        if ( price > 0 ) {
            subtotal = price*qty;
            $('#subtot > span').html('".esc_js($currency)." '+subtotal.toFixed(2));
        } else {
            $('#subtot > span').html('');
        }
    });

    $('form.variations_form').on('show_variation', function(event, data){
        price = data.display_price;
        subtotal = price*qty;
        $('#subtot > span').html('".esc_js($currency)." '+subtotal.toFixed(2));
    }).on('hide_variation', function(){
        $('#subtot > span').html('');
    });");
    else
    wc_enqueue_js("const price = ".floatval($price).";
    var subtotal = $('[name=quantity]').val()*price;
    $('#subtot > span').html('".esc_js($currency)." '+subtotal.toFixed(2));

    $('[name=quantity]').on('input change', function() { 
        subtotal = $(this).val()*price;
        $('#subtot > span').html('".esc_js($currency)." '+subtotal.toFixed(2));
    });");
}

代码位于子主题的functions.php 文件中（或插件中）。已测试并有效。