Возврат радиовхода всегда проверяется верно ⇐ Html

[Anonymous]

Для проекта, над которым я работаю, мне нужен контроль над проверкой и снятием флажков некоторых радиовходов. Я добавляю прослушиватели событий, как показано в коде. Тем не менее, я никогда не прохожу проверку input.checked, потому что это всегда правда, и я не могу понять, почему.
Также как jsfiddle

Код: Выделить всё

document.addEventListener('DOMContentLoaded', function() {

const radiotest = document.getElementById('radiotest');

if (!radiotest) return;

radiotest.querySelectorAll('li').forEach(
li => {
// console.log('adding listener to radio item', li);
li.addEventListener('click', (e) => {
// Prevent the native toggle so we fully control selection
e.preventDefault();
e.stopPropagation();
selectItem(li, e).catch(err => console.error(err));
});
}
);

async function selectItem(li, event) {
return new Promise((resolve) => {
// In case this function is called from other places, be defensive
console.log('selectItem called for', li);
const input = li.querySelector('input');
if (!input) return resolve();
if (input.type === 'radio') {
console.log('radio item clicked:', input.checked);
// do nothing if already selected
if (input.checked) { // This allways seems to be true
console.log('radio item already selected, doing nothing');
return resolve();
}

// The following code is never executed

// clear other radios in this list
const radiotest = document.getElementById('radiotest');
radiotest.querySelectorAll('li').forEach(other => {
console.log('clearing radio item class:', other);
other.classList.remove('active');
});
radiotest.querySelectorAll('input[type="radio"]').forEach(r => {
console.log('clearing radio item checked:', r);
r.checked = false;
});
input.checked = true;
li.classList.add('active');
console.log('radiotest selection:', input.value, input.checked);
}
resolve();
});
}

})

Код: Выделить всё

[list]
[*]

Radio1

[*]

Radio2

[*]

Radio3

[*]

Radio4

[/list]

Подробнее здесь: https://stackoverflow.com/questions/798 ... ecked-true