当产品属性有附加价格时更改产品价格(WooCommerce) [英] Change product price when product attribute has an additional price (WooCommerce)

问题描述

对于我的网店之一，我试图实现以下目标:网上商店中的所有产品都有变化.例如，产品 X 可以订购 RED 颜色，也可以订购 BLACK 颜色.现在我试图在 WooCommerce 中设置一个额外的价格，例如黑色.

For one of my webshops im trying to achieve the following: All of the products in the webshop have variations. For example Product X can be ordered in the color RED but also in the color BLACK. Now im trying to set an additional price in WooCommerce for example the color Black.

红色 - 无需额外费用颜色 黑色 - 额外费用 €30

Color RED - No additional costs Color Black- Additional cost €30

1. 如何在 WooCommerce 中设置此额外费用?我只能为产品变体设置总价.

1. How can i set this additional cost in WooCommerce? I can only set a total price for a product variation.

如何在选项选择框中显示这些额外费用?

How can i display these additional costs in the option selectbox?

如果用户选择颜色黑色，我想更改产品价格(将额外费用加到正常产品价格上)

If a user chooses Color Black i want to change the product price (Add up the additional cost to the normal product price)

您可以在下面找到我想要实现的目标:https://product-extras.catapultthemes.com/product/macbook/

Below you can find what im trying to achieve: https://product-extras.catapultthemes.com/product/macbook/

在这里您可以看到当您更改另一个选项时总价的变化.

Here you can see the total price changing when you change another option.

以下是我的网店网址:http://demasagetafel-specialistnl.webhosting.be/winkel/mobile-massagetafels/ct-kahuna-set-inklapbaar/

推荐答案

对于这样的前端:

var start_product_cost=500.01;
var total_product_cost=0;


function calk_product_cost(){
   var curent_cost=start_product_cost;
   $('select').each(function(){
   	    var curent_select_val=parseFloat($(this).val());
   	    curent_cost+=curent_select_val;
   });
   total_product_cost=curent_cost;
   $('#div_for_total').html('$'+curent_cost);
}


$('select').change(function(){
	calk_product_cost();
});

$('#btn_for_buy').click(function(){
	alert('Your product price : $'+total_product_cost);
});

calk_product_cost();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<div id="div_for_total"></div>

<select>
   <option value="0">not need</option>
   <option value="5">test option 1 (+5$)</option>
   <option value="10" selected>test option 2 (+10$)</option>
   <option value="20">test option 3 (+20$)</option>
   <option value="-20">test option 4 (-20$)</option>
</select>

</br>

<select>
   <option value="0">not need</option>
   <option value="3">new test option 1 (+3$)</option>
   <option value="6">new test option 2 (+6$)</option>
   <option value="9" selected>new test option 3 (+9$)</option>
   <option value="-3">new test option 4 (-3$)</option>
</select>
</br>
<input id="btn_for_buy" type="button" value="Add to cart">

这篇关于当产品属性有附加价格时更改产品价格(WooCommerce)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！