JSFiddle - React, Tailwind, and code Playground
HTML
<p>Test</p>
<span>Answer 1: </span><input class="inputs"/><br>
<span>Answer 2: </span><input class="inputs"/><br>
<span>Answer 3: </span><input class="inputs"/><br>
<hr>
<span>Pick correct expressions: </span><br>
<input type="checkbox" name="quiz" class="inputsCheckBox" value="0">2 + 2 = 5<br>
<input type="checkbox" name="quiz" class="inputsCheckBox" value="1">God exist<br>
<input type="checkbox" name="quiz" class="inputsCheckBox" value="2">3 * 2 = 7<br>
<hr>
<span>You should drink: </span><br>
<input type="checkbox" name="drinks" class="inputsCheckBox" value="m">Milk<br>
<input type="checkbox" name="drinks" class="inputsCheckBox" value="b">Beer<br>
<input type="checkbox" name="drinks" class="inputsCheckBox" value="v">Vodka<br>
<hr>
<span>Positive number: </span><br>
<input type="checkbox" name="numbers" class="inputsCheckBox" value="0">3<br>
<input type="checkbox" name="numbers" class="inputsCheckBox" value="1">-4<br>
<input type="checkbox" name="numbers" class="inputsCheckBox" value="2">9<br>
<input type="checkbox" name="numbers" class="inputsCheckBox" value="3">64<br>
<br>
<button onclick="checkMe()">Check</button>
JavaScript
function checkMe() {
// Правильные ответы
var correctInput = ['green', '777', 'js'];
var correctCheckBox = {
'quiz': {},
'drinks': {'b': true, 'v': true},
'numbers': {'0': true, '2': true, '3': true}
};
// Вспомогательные переменные
var answers, i, j, flag;
// Кол-во правильных ответов
var result = 0;
// Получаем набор input'ов
answers = document.getElementsByClassName('inputs');
// В цикле сравниваем значения
// в них с правильными ответами
for (i = 0; i < answers.length; i++)
if (answers.item(i).value == correctInput[i])
result++;
// Проверяем правильность checkbox'ов
for (i in correctCheckBox) {
// Получаем набор checkbox'ов
answers = document.getElementsByName(i);
flag = true;
for (j = 0; j < answers.length; j++)
if (answers.item(j).checked != Boolean(correctCheckBox[i][answers.item(j).value])) {
flag = false;
break;
}
if (flag)
result++;
}
alert('Кол-во правильных ответов: ' + result + '!');
};