Как установить выбранное значение переключателей в переменную?

Question

У меня есть игра, набирающая скорость.У меня также есть форма с 3 радио-кнопками, и я хочу выбрать уровень игры на основе выбранной радио-кнопки.Как я могу это сделать?

Я пробовал с document.querySelector('input[name="genderS"]:checked').value; этот код здесь.Но это не сработало

const levels = {
  easy: 5,
  medium: 3,
  hard: 1
};


let easyChecked = document.querySelector('#radio-easy').checked;
let mediumChecked = document.querySelector('#radio-medium').checked;
let hardChecked = document.querySelector('#radio-hard').checked;

var currentLevel = levels.medium;
let time = currentLevel;
let score = 0;
let isPlaying;

// To change level
function isChecked() {

}

Я ожидаю, что переменная currentLevel будет изменена в зависимости от переключателей.

Answer 1

Просто создайте HTML-код своего радио-кнопки с таким же именем, как это:

<input type="radio" name="level" value="easy"> Easy<br>
<input type="radio" name="level" value="medium"> Medium<br>
<input type="radio" name="level" value="hard"> Hard<br>

, а затем свяжите все радио-кнопки с событием on change по циклу foreach

let selectedLevel;
const levelButtons = document.querySelectorAll('input[name="level"]');
Array.prototype.forEach.call(levelButtons, function(btn) {
  btn.addEventListener('change', function(){
    selectedLevel = this.value;
    console.log(selectedLevel);
  });
});

Answer 2

Примерно так:

 var currentLevel = null;  // not set yet

 let easyChecked = document.querySelector('#radio-easy');
 let mediumChecked = document.querySelector('#radio-medium');
 let hardChecked = document.querySelector('#radio-hard');

 easyChecked.addEventListener("change", function() {
   currentLevel = this.checked; // update currentLevel on change
 }); 
 mediumChecked.addEventListener("change", function() {
   currentLevel = this.checked; // update currentLevel on change
 }); 
 hardChecked.addEventListener("change", function() {
   hardChecked = this.checked; // update currentLevel on change
 }); 

Теперь currentLevel будет обновляться при смене переключателей.