參考網站

目前只有單獨呈現簡單商品以及單獨呈現可變商品的價格

沒有兩個合在一起的

雖然參考文章內有人結合,但我嘗試後並沒有成功,商品頁面無反應

(簡單商品)

//當商品頁面數量變更時 同步呈現變更的價格金額 (簡單商品)
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;">金額: <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(0);
	$('#subtot > span').html('" . esc_js( $currency ) . "'+price_string);
	}).change();");
}

(可變商品)

//allow this particular AJAX function for logged in users
add_action('wp_ajax_myajax', 'woocommerce_total_product_price');

//allow this particular AJAX function for non-logged in users
add_action('wp_ajax_nopriv_myajax', 'woocommerce_total_product_price');

add_action( 'woocommerce_single_product_summary', 'woocommerce_total_product_price', 31 );
function woocommerce_total_product_price() {
  global $woocommerce, $product;
  // let's setup our divs
  echo sprintf('<div id="product_total_price" style="margin:20px auto;">%s %s</div>',__('Product Total:','woocommerce'),'<span class="price"></span>');
  ?>
    <script>
      jQuery(function($){
        //var price = <?php echo $product->get_price(); ?>,

        currency = '<?php echo get_woocommerce_currency_symbol(); ?>';

        $('[name=quantity]').change(function(){
          if (!(this.value < 1)) {
            var price = jQuery('.single_variation_wrap .woocommerce-Price-amount.amount bdi').first().contents().filter(function() {
              return this.nodeType == 3;
            }).text().replace(',','');

            var product_total = parseFloat(price * this.value);

            $('#product_total_price .price').html( currency + addCommas(product_total.toFixed(2)));

          }
        });
      });

      function addCommas(nStr) {
        nStr += '';
        var x = nStr.split('.');
        var x1 = x[0];
        var x2 = x.length > 1 ? '.' + x[1] : '';
        var rgx = /(\d+)(\d{3})/;
        while (rgx.test(x1)) {
          x1 = x1.replace(rgx, '$1' + ',' + '$2');
        }
        return x1 + x2;
      }
    </script>
  <?php
}

(兩者結合 但我嘗試未成功)

add_action( 'woocommerce_single_product_summary', 'woocommerce_total_product_price', 31 );

function woocommerce_total_product_price() {
    global $woocommerce, $product;
    $product_type = $product->get_type(); ?> 

    <script>
        function addCommas(nStr) {
            nStr += '';
            const x = nStr.split('.');
            let x1 = x[0];
            const x2 = x.length > 1 ? '.' + x[1] : '';
            const rgx = /(\d+)(\d{3})/;
            while (rgx.test(x1)) {
                x1 = x1.replace(rgx, '$1' + ',' + '$2');
            }
            return x1 + x2;
        }

        function resetVariations() {
            jQuery('.reset_variations').click(function() {
                jQuery('.current-price').html('');
            });
        }

        function updateCurrentPrice(productType) {
            jQuery(function($){                
                let price = <?php echo $product->get_price(); ?>;
                const currency = '<?php echo get_woocommerce_currency_symbol(); ?>';

                $('[name=quantity]').change(function(){
                    if (!(this.value < 1)) {
                        if (productType === 'variable') {
                            price = jQuery('.single_variation_wrap .woocommerce-Price-amount.amount bdi').first().contents().filter(function() {
                                return this.nodeType == 3;
                            }).text().replace(',','');
                        }

                        const product_total = parseFloat(price * this.value);

                        $('.current-price').html( currency + addCommas(product_total.toFixed(2)));
                    }
                });
            });
        }

        updateCurrentPrice('<?php echo $product_type; ?>');
        resetVariations();
    
    </script>
    <?php
}
最後修改日期: 2021 年 11 月 26 日

作者