Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Сложение нескольких чекбоксов (https://javascript.ru/forum/misc/59136-slozhenie-neskolkikh-chekboksov.html)

anton303 29.10.2015 13:22

Сложение нескольких чекбоксов
 
Добрый день.
Помогите пожалуйста написать код. Есть три чекбокса:
1 Стоимость дома 500 000 рублей
2 Стоимость утепления 100 000 рублей
3 Стоимость фундамента 150 000 рублей

Нужно, чтоб выводилась сумма этих чекбоксов в блок сразу без нажатия кнопки (кнопка вообще не нужна);
Первый чекбокс был сразу выбран по умолчанию и в блоке суммы отображалась сумма 500 000;
А при выборе второго и третьего чекбокса, они складывались с первым

рони 29.10.2015 13:41

anton303,
вы начните или поищите решение на форуме ... хотябы

ruslan_mart 29.10.2015 13:53

var result = check1.checked * 500000 + check2.checked * 100000 + check3.checked * 150000;


Или

var result = check1.checked * 5E5 + check2.checked * 1E5 + check3.checked * 15E4;

anton303 29.10.2015 13:54

Я нашел одно более-менее похожее для меня решение, вот:
<form name="Sum">
<input type="checkbox" name="aa" value="500000">Стоимость дома 500000 руб.<BR>
<input type="checkbox" name="aa" value="100000">Стоимость утепления 100000 руб.<BR>
<input type="checkbox" name="aa" value="150000">Стоимость фундамента 150000 руб.<BR>

<output id="rezultat">Сумма: 0</output>
</form>

<script>
var s = document.forms.Sum,
d = s.querySelectorAll('input[type="checkbox"]:not([value]), input[type="checkbox"][value=""]');
for (var l = 0; l < d.length; l++) // чтобы не было написано NaN, убираем в disabled пункты, где не прописаны значения
d[l].disabled = true;
s.onchange = function() { // начало работы функции сложения
var n = s.querySelectorAll('[type="checkbox"]'),
itog = 0;
for(var j=0; j<n.length; j++)
n[j].checked ? itog += parseFloat(n[j].value) : itog;
var z1 = (itog);
document.getElementById('rezultat').innerHTML = 'Сумма: ' + z1;
}
</script>

но тут складывается только при клике на чекбокс

ruslan_mart 29.10.2015 14:04

<form name="myForm">
    <input checked="checked" name="check1" type="checkbox">
    <input name="check2" type="checkbox">
    <input name="check3" type="checkbox">
</form>
        
<div id="result"></div>


(function() {
    var form = document.forms.myForm,
        labels = form.elements,
        result = document.getElementById('result');
    
    function onChange() {
        result.innerHTML = labels.check1.checked * 5E5 + labels.check2.checked * 1E5 + labels.check3.checked * 15E4 + 'р.';
    };
    
    form.addEventListener('change', onChange);
    onChange();
    
})();

anton303 29.10.2015 14:04

Ruslan_xDD, прошу прощения, просто я полный ноль в этом. А можно полностью код написать

ruslan_mart 29.10.2015 14:06

anton303, уже написал.

anton303 29.10.2015 14:09

Ruslan_xDD,
спасибо большое)

anton303 29.10.2015 14:23

Ruslan_xDD,
подскажите еще пожалуйста, как перед итоговой суммой поставить "Итоговая стоимость дома:"

ruslan_mart 29.10.2015 14:47

<div>
    <b>Итоговая стоимость дома: </b>
    <span id="result"></span>
</div>


Часовой пояс GMT +3, время: 22:19.