JSFiddle - React, Tailwind, and code Playground
by mixailhr
HTML
<div>
<p>Выберите пункт расчета?</p>
<input type="radio" value="25000" name="n2" checked>Расчет 1<br />
<input type="radio" value="40000" name="n2">Расчет 2<br />
<input type="radio" value="60000" name="n2">Расчет 3<br />
<input type="radio" value="80000" name="n2">Расчет 4<br /> <br />
<p>Дополнительные услуги:</p>
<input value="15000" class="checkbox" type="checkbox" checked>Пункт 1<br />
<input value="20000" class="checkbox" type="checkbox">Пункт 2<br />
<input value="15000" class="checkbox" type="checkbox">Пункт 3<br /> <br /> <!-- и снова в value пишем значение, соответствующее данному пункту -->
<button onclick="Start();">Рассчитать!</button> <br/> <br /> <!-- задаем выполнение функции Start при клике на кнопку -->
<div style="font-weight:bold" id="result"></div> <!-- контейнер для вывода результатов -->
</div>
<script>
function Start(){
var radios = document.getElementsByName('n2'); //определяем какой из пунктов выбран и запоминаем его value в переменную radio
for (var i = 0; i < radios.length; i++) {
if (radios[i].type == "radio" && radios[i].checked) {
var radio = parseInt ( radios[i].value );
}
}
var checkboxes = document.getElementsByClassName('checkbox'); //определяем какие из "галочек" выбраны и запоминаем их value в массив checkbox
checkbox = []; // задаем пустой массив checkbox
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].type == "checkbox" && checkboxes[i].checked) {
checkbox[checkbox.length] = checkboxes[i].value; //дописываем к массиву checkbox значение value, если оно выбрано
}
}
var result = radio; //элемент первого поля умножаем на значение из списка и прибавляем значение из следующего списка. Промежуточный результат сохраняем в result
for ( var i = 0; i<...