Question

对于我的一个网上商店，我试图实现以下目标：网上商店的所有产品都有不同的变化。例如，产品X可以用红色订购，也可以用黑色订购。现在我试图在WooCommerce中设置额外的价格，例如黑色。

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

如何在WooCommerce中设置此额外费用？我只能为产品变体设定总价。
如何在选项框中显示这些额外费用？
如果用户选择Color Black我想更改产品价格（将额外费用加到正常产品价格中）

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

您可以在此处看到更改其他选项时的总价格变化。

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

Answer 1

对于这样的前端：

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）

1 个答案: