Нуже так называем “журнальный ” опросник тест. Результатом должно быть одно число в зависимости от выбраных чекбоксов.
На форуме нашел уже ответ, но что то не работает... кто то может помочь с кодом? Жму на результат, но ничего не происходит...
<html>
<head>
<script language="JavaScript">
var btnResutl = document.getElementById('btnResutl');
var resultFild = document.getElementById('resultFild');
var inputFild = document.getElementsByTagName('input');
btnResutl.addEventListener('click', function(){
let resultedInputs = document.querySelectorAll("input[type='radio']:checked");
let result = 0;
Array.prototype.map.call(resultedInputs, (el)=>{
result += parseInt(el.dataset.value);
});
console.log(result);
resultFild.innerHTML = result + ' баллов'
});</script>
</head>
<body>
<h4>Your test</h4>
<h3>Try yourself</h3>
<div class="question">
<p>Do you have..</p>
<input type="radio" value= "1" name="r1" id="Answer" data-value='1'><label>Home</label>
<input type="radio" name="r1" id="Answer" data-value='2'><label>Sity</label>
<input type="radio" name="r1" id="Answer" data-value='3'><label>Advanture</label>
</div>
<div class="question">
<p>Do you have..</p>
<input type="radio" value= "1" name="r2" id="Answer" data-value='4'><label>Home</label>
<input type="radio" name="r2" id="Answer" data-value='5'><label>Sity</label>
<input type="radio" name="r2" id="Answer" data-value='6'><label>Advanture</label>
</div>
<div class="question">
<p>Do you have..</p>
<input type="radio" name="r3" id="Answer" data-value='7'><label>Home</label>
<input type="radio" name="r3" id="Answer" data-value='8'><label>Sity</label>
<input type="radio" name="r3" id="Answer" data-value='9'><label>Advanture</label>
</div>
<div class="question">
<p>Do you have..</p>
<input type="radio" name="r4" id="Answer" data-value='10'><label>Home</label>
<input type="radio" name="r4" id="Answer" data-value='11'><label>Sity</label>
<input type="radio" name="r4" id="Answer" data-value='12'><label>Advanture</label>
</div>
<button id="btnResutl">Result</button>
<div id="resultFild"></div>
</body>
</html>