Тест со опции за одговор во HTML код на JavaScript

Во претходните лекции одговорите на прашањата од тестот требаше да се внесуваат во полиња за внес. Во животот, сепак, често постојат и тестови во кои може да се избере една опција за одговор од понудените. Ајде да научиме како да создаваме вакви тестови.

Ајде повторно да започнеме со едноставна верзија, кога прашањата и одговорите се чуваат во HTML кодот, а потоа постепено ќе усложнуваме.

Значи, еве тест со опции за одговор:

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.