JavaScriptda HTML kodida javob variantlari bilan test

Oldingi darslarda test savollariga javoblar inputlar orqali kiritilishi kerak edi. Ammo, hayotda, taklif etilgan variantlardan bittasini tanlash mumkin bo'lgan testlar ham tez-tez uchraydi. Keling, bunday testlarni yaratishni o'rganamiz.

Keling, yana oddiy variantdan boshlaymiz, savollar va javoblar HTML kodida saqlanadi, keyin esa asta-sekin murakkablashtiramiz.

Shunday qilib, javob variantlari bilan test:

html<div id="test">
  <div>
    <p>savol 1?</p>
    
    <label>
      <input type="radio" name="1" data-right>
      variant 1
    </label>
    <label>
      <input type="radio" name="1">
      variant 2
    </label>
    <label>
      <input type="radio" name="1">
      variant 3
    </label>
  </div>
  <div>
    <p>savol 2?</p>
    
    <label>
      <input type="radio" name="2">
      variant 1
    </label>
    <label>
      <input type="radio" name="2" data-right>
      variant 2
    </label>
    <label>
      <input type="radio" name="2">
      variant 3
    </label>
  </div>
  <div>
    <p>savol 3?</p>
    
    <label>
      <input type="radio" name="3">
      variant 1
    </label>
    <label>
      <input type="radio" name="3">
      variant 2
    </label>
    <label>
      <input type="radio" name="3" data-right>
      variant 3
    </label>
  </div>
</div>

Ko'rib turganingizdek, javob variantlarini radio tugmachalari yordamida tanlashimiz mumkin. Bunda har bir savolda to'g'ri variant bilan radio tugmasi data-right atributi bilan belgilangan.