Здесь есть две вещи, и самый высокий проголосовавший ответ технически корректен в соответствии с вопросом OP.
Кратко суммируется как:
$("some sort of selector").prop("disabled", true | false);
Однако следует ли использовать jQuery UI (я знаю, что OP не был, но некоторые люди, прибывающие сюда, могли бы быть), тогда как это отключит кнопки события click, это не приведет к отключению кнопки в соответствии с стилем UI.
Если вы используете кнопка стиля jQuery UI, тогда ее следует включить / отключить с помощью:
$("some sort of selector").button("enable" | "disable");
Вот основной фрагмент. Что помогает вам очистить свой путь. Просто скопируйте код ниже.
<div id="question1" style="position:fixed; left:20px; top: 50px;">
<label> <input type="radio" name="q0" value="a1" id="a1" class="radio" onchange="checkAns()"> IMAGE 1 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a2" id="a2" class="radio" onchange="checkAns()"> IMAGE 2 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a3" id="a3" class="radio" onchange="checkAns()"> IMAGE 3 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a4" id="a4" class="radio" onchange="checkAns()"> IMAGE 4 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a5" id="a5" class="radio" onchange="checkAns()"> IMAGE 5 <br><br><br> </label>
<button id="btn" disabled>Button</button>
</div>
<script>
var a1 = document.getElementById('a1');
var a2 = document.getElementById('a2');
var a3 = document.getElementById('a3');
var a4 = document.getElementById('a4');
var a5 = document.getElementById('a5');
function checkAns(){
console.log(a1.checked, a2, a3, a4, a5);
if (a1.checked || a2.checked || a3.checked || a4.checked || a5.checked) {
document.getElementById("btn").disabled = false;
}
}
</script>
Это может помочь.
Вы могли бы хотеть получить все флажки, выполняющие querySelector, а затем проверить, какой из них отмечен, а какой не выбран. Я добавил две функции с ним, вы можете просто запустить одну для цикла и сделать ту же логику.
function getUncheckedValues() {
const obj = {};
Array.from(document.querySelectorAll('input[type="radio"]'))
.forEach((checkbox) => {
obj[checkbox.value] = checkbox.checked
});
console.log(obj);
return obj;
}
const resultEl = document.getElementById('checkedresult');
const resultUncheckEl = document.getElementById('uncheckedresult');
document.getElementById('showResult').addEventListener('click', () => {
const values = getUncheckedValues();
console.log(values);
const newRef = firebase.database().ref('messages').push();
newRef.set(values);
});
<label> <input type="radio" name="q0" value="a1" id="a1" class="radio"> IMAGE 1 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a2" id="a2" class="radio"> IMAGE 2 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a3" id="a3" class="radio"> IMAGE 3 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a4" id="a4" class="radio"> IMAGE 4 <br><br><br> </label>
<label> <input type="radio" name="q0" value="a5" id="a5" class="radio"> IMAGE 5 <br><br><br> </label>
<br><br>
<button id="showResult">Show checked values</button>
<br><br>
<div id="checkedresult"></div>
<div id="uncheckedresult"></div>