Тест с опции за отговор в HTML код на JavaScript
В предишните уроци отговорите на въпросите на теста трябваше да се въвеждат в инпути. В живота, обаче, често има и текстове, в които може да се избере една опция за отговор от предложените. Нека се научим да създаваме такива тестове.
Нека отново започнем с проста версия, когато въпросите и отговорите се съхраняват в HTML код, и след това постепенно ще усложняваме.
И така, ето тест с опции за отговор:
<div id="test">
<div>
<p>въпрос 1?</p>
<label>
<input type="radio" name="1" data-right>
вариант 1
</label>
<label>
<input type="radio" name="1">
вариант 2
</label>
<label>
<input type="radio" name="1">
вариант 3
</label>
</div>
<div>
<p>въпрос 2?</p>
<label>
<input type="radio" name="2">
вариант 1
</label>
<label>
<input type="radio" name="2" data-right>
вариант 2
</label>
<label>
<input type="radio" name="2">
вариант 3
</label>
</div>
<div>
<p>въпрос 3?</p>
<label>
<input type="radio" name="3">
вариант 1
</label>
<label>
<input type="radio" name="3">
вариант 2
</label>
<label>
<input type="radio" name="3" data-right>
вариант 3
</label>
</div>
</div>
Както виждате, опциите за отговор можем да
изберем с помощта на радио бутони. При това
във всеки въпрос радио бутонът с правилната
опция е отбелязан с атрибут data-right.
Направете така, че при избор на една от отговорите на въпроса този отговор веднага да се проверява за правилност.
Модифицирайте вашия код така, че проверката на отговорите да се извършва при натискане на бутон.
