Javascript-форум - input radio - как узнать выбранный пункт?

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - input radio - как узнать выбранный пункт? (https://javascript.ru/forum/misc/70898-input-radio-kak-uznat-vybrannyjj-punkt.html)

input radio - как узнать выбранный пункт?

Есть input radio:

<label class="control-label">Отзыв о…</label>
    <p>
        <input type="radio" name="review_type" value="1" id="review_type1" checked> Работе в компании<br />
        <input type="radio" name="review_type" value="2" id="review_type2"> Зарплате на должности<br />
        <input type="radio" name="review_type" value="3" id="review_type3"> Собеседовании<br />
        <input type="radio" name="review_type" value="4" id="review_type4"> Бонусах в компании<br />
    </p>

Пытаюсь определить выбранный пункт таким способом:

window.onload = function(){
    var rt1 = document.getElementById('review_type1');
    var rt2 = document.getElementById('review_type2');
    var rt3 = document.getElementById('review_type3');
    var rt4 = document.getElementById('review_type4');

    if (rt1.checked) {
        alert('Выбран 1 пункт');
    }
    if (rt2.checked) {
        alert('Выбран 2 пункт');
    }
    if (rt3.checked) {
        alert('Выбран 3 пункт');
    }
    if (rt4.checked) {
        alert('Выбран 4 пункт');
    }
};

JS сообщает о пункте выбранном по умолчанию, при загрузке страницы, но если изменить выбор - никакой реакции от JS нет.

При этом, в инструкциях которые видел, везде предлагают проверять через checked. Спрашивается... что я делаю не так? Или, чтобы отслеживать выбор в реальном времени - нужно еще событие клика ловить?

Просьба подсказать на понятном новичку языке.

Цитата:

Сообщение от Walk

Или, чтобы отслеживать выбор в реальном времени - нужно еще событие клика ловить?

Ваше умозаключение верно.
Однако лучше отслеживать событие изменения состояния элемента («onchange»).

Сделал так:

<p>
        <input type="radio" name="review_type" value="1" onclick="checkType()" checked> Работе в компании<br />
        <input type="radio" name="review_type" value="2" onclick="checkType()"> Зарплате на должности<br />
        <input type="radio" name="review_type" value="3" onclick="checkType()"> Собеседовании<br />
        <input type="radio" name="review_type" value="4" onclick="checkType()"> Бонусах в компании<br />
    </p>

function checkType() {
    alert(getCheckedRadioValue('review_type'));
}

function getCheckedRadioValue(name) {
    var elements = document.getElementsByName(name);

    for (var i=0, len=elements.length; i<len; ++i)
        if (elements[i].checked) return elements[i].value;
}

Работает, хотя не знаю, на сколько данный способ наилучший.

Walk, можно упростить:

<input type="radio" name="review_type" value="2" onclick="checkType(*!*this*/!*)">

function checkType(node) {
    alert(node.value);
}

<p>
        <input type="radio" name="review_type" value="1"  checked> Работе в компании<br />
        <input type="radio" name="review_type" value="2"> Зарплате на должности<br />
        <input type="radio" name="review_type" value="3"> Собеседовании<br />
        <input type="radio" name="review_type" value="4"> Бонусах в компании<br />
</p>
<script>
   document.querySelector('p').onclick = function(e) {
    alert(e.target.value);
  }
</script>

document.querySelectorAll('input[name="review_type"]:checked')