Помогите новичку: нужно сложить все "итого" (id="summa") по выбранному товару и при нажатии на кнопку вывести "общую сумму" (id="tot_summ") в HTML. Получилось вывести только значения, но они не суммируются. Нужен код на javascript (jQuery вообще не понимаю). Заранее спасибо
function calkulator() {
var inputs = document.querySelectorAll('.pr');
var sumsTotal = document.querySelectorAll('#summa');
var sums = document.querySelectorAll('.sum');
inputs.forEach((item, i) => {
item.addEventListener('input', () => {
var x = item.value * Number(sums[i].innerHTML);
sumsTotal[i].innerHTML = x;
// console.log(x);
var buttons = document.getElementsByClassName("btn");
for (var button of buttons) {
button.addEventListener('click', () =>
document.getElementById('tot_summ').innerHTML += Number.parseInt(x));
/*console.log("buttons")*/
};
});
});
}
calkulator();
body {
display: inline-block;
}
h2 {
font-size: 20px;
margin-left: 5px;
display: inline;
}
.vegetables__list {
padding-bottom: 30px;
}
<div class="col-3 vegetables__total">
<p class="tot"><b>ОБЩАЯ СТОИМОСТЬ: </b><span id="tot_summ">0</span><b> руб.</b></p>
</div>
<div class="col-3 vegetables__list">
<input id="vegetable" type="checkbox" class="ida" name="veget carrot" value="60" />
<h2>морковь </h2>
</input><br><br>
<p>Цена: <span class="sum">60</span> руб./кг</p>
<p>Количество: <input type="number" name="quantity" class="pr" min="0" max="50" step="0.1" value="" id="quantity" /><span> кг</span></p>
<p>Итого: <span id="summa"></span> руб. </p>
<button type="button" class="btn" id="but">В корзину</button>
</div>
<div class="col-3 vegetables__list">
<input id="vegetable" type="checkbox" name=" veget beet" class="ida" value="80" />
<h2>свекла</h2>
</input><br><br>
<p>Цена: <span class="sum">80</span> руб./кг</p>
<p>Количество: <input type="number" name="quantity" class="pr" min="0" max="50" step="0.1" value="" id="quantity" /><span> кг</span></p>
<p>Итого: <span id="summa"> </span> руб.</p>
<button type="button" class="btn" id="but">В корзину</button>
</div>
<div class="col-3 vegetables__list">
<input id="vegetable" type="checkbox" name="veget cabbage" class="ida" value="40" />
<h2>капуста белокочанная</h2>
</input><br><br>
<p>Цена: <span class="sum">40 </span> руб./кг</p>
<p>Количество: <input type="number" name="quantity" class="pr" min="0" max="50" step="0.1" value="" id="quantity" /><span> кг</span></p>
<p>Итого: <span id="summa"></span> руб.</p>
<button type="button" class="btn" id="but">В корзину</button>
</div>