JSFiddle - React, Tailwind, and code Playground
by Viktor L
HTML
<form action="" id="our-form">
<div>
<label for="item-1">Доставка</label>
<input type="checkbox" name="item-1" id="item-1" value="100">
</div>
<div>
<label for="item-2">Установка</label>
<input type="checkbox" name="item-2" id="item-2" value="150">
</div>
<div>
<label for="item-3">Настройка</label>
<input type="checkbox" name="item-3" id="item-3" value="200">
</div>
<div>
<label for="item-4">Обучение</label>
<input type="checkbox" name="item-4" id="item-4" value="250">
</div>
<div>
<label for="item-5">Обслуживание</label>
<input type="checkbox" name="item-5" id="item-5" value="300">
</div>
</form>
<div>
Стоимость <span id="price">2000</span>руб.
</div>
JavaScript
var total = 2000;
function CalculateTotal(){
$("input:checkbox").each(function(){
if($(this).is(":checked")){
total += parseFloat($(this).val());
}
});
$("#price").html(total);
}
$("input:checkbox").change(function(){
total = 2000;
CalculateTotal();
}).trigger("change");