Здравствуйте, подскажите пожалуйста как создать тесты с помощью js select

Question

Здравствуйте, подскажите пожалуйста как создать тесты с помощью js select

Mmgkgm Mmgkgm Знаток (470), на голосовании 1 год назад

Нужно что-то вроде этого, но вместо input -а select в роли вариантов ответа. Выбираю ответ на вопрос в конце кликою на кнопку и выскакивает h1 с баллом который я получил

Answer 1

Для создания тестов с использованием элементов `select` вам понадобится HTML-разметка для представления вопросов и вариантов ответов, а также JavaScript-код для обработки выбранных ответов и подсчета баллов.

Вот пример простого теста с использованием элементов `select`:

```html
<!DOCTYPE html>
<html>
<head>
<title>Тест</title>
</head>
<body>
<h1>Тест</h1>
<form>
<p>Вопрос 1: Какой язык программирования вы предпочитаете?</p>
<select id="q1">
<option value="">Выберите ответ</option>
<option value="java">Java</option>
<option value="javascript">JavaScript</option>
<option value="python">Python</option>
</select>

<p>Вопрос 2: Что такое HTML?</p>
<select id="q2">
<option value="">Выберите ответ</option>
<option value="markup">Язык разметки</option>
<option value="programming">Язык программирования</option>
<option value="database">Система управления базами данных</option>
</select>

<button type="button" onclick="submitTest()">Проверить ответы</button>
</form>

<h1 id="score"></h1>

<script>
function submitTest() {
let score = 0;

const q1 = document.getElementById("q1").value;
if (q1 === "javascript") {
score++;
}

const q2 = document.getElementById("q2").value;
if (q2 === "markup") {
score++;
}

document.getElementById("score").textContent = "Вы набрали " + score + " баллов";
}
</script>
</body>
</html>
```

В этом примере мы создаем форму с двумя вопросами, каждый из которых имеет свой элемент `select` с вариантами ответов. При нажатии на кнопку "Проверить ответы" мы вызываем функцию `submitTest()`, которая получает выбранные ответы и проверяет их соответствие правильным ответам. В итоге функция выдает баллы и отображает их на странице.

Надеюсь, это поможет вам создать свой тест с использованием элементов `select`!