目前只有單獨呈現簡單商品以及單獨呈現可變商品的價格
沒有兩個合在一起的
雖然參考文章內有人結合,但我嘗試後並沒有成功,商品頁面無反應
(簡單商品)
//當商品頁面數量變更時 同步呈現變更的價格金額 (簡單商品)
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
}