Мне нужно иметь check/uncheck all box для каждого набора книг. Он также должен добавить общую стоимость и вес. Пока я могу только проверять каждый ящик, и он добавляет значения просто отлично, но как только я добавляю функцию для проверки всех ящиков, все перестает работать.Установите/снимите флажок и добавьте значения
//check all function (commented it because it does not work)
//$("#checkAll").change(function() {
//$("input:checkbox").prop('checked', $(this).prop("checked"));
//});
// add weight and price
var inputs = document.getElementsByClassName('sum'),
totalElement = document.getElementById('payment-total'),
weightElement = document.getElementById('payment-weight'),
totalPrice = 0,
totalWeight = 0;
for (var i = 0; i < inputs.length; i++) {
inputs[i].onchange = function() {
if (this.checked) {
totalPrice += parseFloat(this.value);
totalWeight += parseFloat(this.getAttribute('Bweight'));
} else {
totalPrice -= parseFloat(this.value);
totalWeight -= parseFloat(this.getAttribute('Bweight'));
}
totalElement.innerHTML = totalPrice.toFixed(2);
weightElement.innerHTML = totalWeight.toFixed(2);
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p><label><input type="checkbox" id="checkAll"/> Check all Set A</label></p>
<fieldset>
<legend>Set A Books</legend>
<input value="300" type="checkbox" bweight=".500" id="ENG101" class="sum" data-toggle="checkbox"> English
<input value="500" type="checkbox" bweight=".330" id="SCI101" class="sum" data-toggle="checkbox"> Science
<input value="755" type="checkbox" bweight=".633" id="CLE101" class="sum" data-toggle="checkbox"> Christian Living
</fieldset>
<p><label><input type="checkbox" id="checkAll"/> Check all Set B</label></p>
<fieldset>
<legend>Set B Books</legend>
<input value="245" type="checkbox" bweight=".845" id="ENG202" class="sum" data-toggle="checkbox"> English
<input value="534" type="checkbox" bweight=".734" id="SCI202" class="sum" data-toggle="checkbox"> Science
<input value="623" type="checkbox" bweight=".257" id="CLE202" class="sum" data-toggle="checkbox"> Christian Living
<input value="954" type="checkbox" bweight=".845" id="MAT101" class="sum" data-toggle="checkbox"> Math
</fieldset>
<p></p>
<div class="card-charge-info">
Weight <span id="payment-weight">0</span>
</div>
<div class="card-charge-info">
Price <span id="payment-total">0</span>
</div>
мне нужно, чтобы он работает таким образом, что, когда проверка всех выбран, он должен также добавить общую стоимость и вес независимо, если отдельные ящики проверяются. Я бы очень признателен за вашу помощь, поскольку я застрял с этим в течение нескольких дней. Спасибо!
же идентификаторы для checkall является недействительным. Идентификаторы должны быть уникальными для каждого элемента, а вместо этого - для класса. – Jai
Попробуйте https://jsfiddle.net/yfuff4ht/4/ –
https://jsfiddle.net/yfuff4ht/7/ –