Объединить значения выбираемых для достижения общей стоимости

Question

Я работаю на сайте, где вы можете выбрать размер верхней и/или нижней частей, а цена рассчитывается на основе того, что вы выберете. Цены для всех размеров одинаковы, но цена варьируется в зависимости от того, есть ли у вас один верхний или нижний или оба выбранных элемента.

Итак, в приведенном ниже примере результат должен составлять 130 долларов США, если вы выберете только верхнюю или нижнюю часть, 260 долларов США, если вы выберете оба варианта, или 0, если вы снова установите оба варианта возврата к параметру по умолчанию.

HTML

<label for="size_top">Select Size (Bikini Top)</label> 
<select name="size_top" id="size_top" data-price="130"> 
    <option value="" data-multiplier="0">--</option> 
    <option value="6" data-multiplier="1">Size 6</option> 
    <option value="8" data-multiplier="1">Size 8</option> 
    <option value="10" data-multiplier="1">Size 10</option> 
    <option value="12" data-multiplier="1">Size 12</option> 
</select> 
<label for="size_btm">Select Size (Bikini Bottom)</label> 
<select name="size_btm" id="size_btm" data-price="130"> 
    <option value="" data-multiplier="0">--</option> 
    <option value="6" data-multiplier="1">Size 6</option> 
    <option value="8" data-multiplier="1">Size 8</option> 
    <option value="10" data-multiplier="1">Size 10</option> 
    <option value="12" data-multiplier="1">Size 12</option> 
</select> 

JS

var basePrice = price = multiplier = 0; 

$("select").on("change",function(){ 

    basePrice = parseInt($(this).data("price")); 
    multiplier = parseInt($(this).find(":selected").data("multiplier")); 

    $("select").each(function() { 
    price += basePrice * multiplier; 
    }); 

    $(".price").text(price); 

}); 

Что хотя происходит в том, что, когда вы сначала изменить отборное, значение 390, а затем каждый раз, когда вы выбираете значение где множитель не 0, он добавляется к итогу, поэтому он просто продолжает расти.

Если я перехожу на price = basePrice * multiplier, я получаю правильное значение, но только для одного выбора.

Answer 1

Попробуйте

$("select").on("change",function(){ 

    basePrice = parseInt($(this).data("price")); 
    multiplier = parseInt($(this).find(":selected").data("multiplier")); 

    basePrice2 = parseInt($('#size_btm').data("price")); 
    multiplier2 = parseInt($('#size_btm').find(":selected").data("multiplier")); 
var fp = basePrice * multiplier + basePrice2 * multiplier2 ; 
    $(".price").text(fp); 

});