Використовуючи jQuery для вибору / скасування вибору кнопок з різними іменами - javascript, jquery, html, radio-button

У мене є вікторина, яка використовує ідентифікатори відповідей у ​​БД як ім'я, щоб перевірити, чи вони "правильні". Отже, я не можу зробити їх усіма однойменними.

У будь-якому випадку це залишає мені перемикачі, яківсе можна перевірити, і це не так, як це повинно працювати. Я знайшов jQuery, який дозволяє відміняти перемикачі, але мені потрібно зняти прапорець, коли ви натискаєте інші кнопки.

HTML:

<fieldset>
<input type="radio" name="21">
<label for="21">Answer 21</label>
<input type="radio" name="22" class="checked">
<label for="22">Answer 22</label>
<input type="radio" name="23" class="">
<label for="23">Answer 23</label>
<input type="radio" name="24">
<label for="24">Answer 24</label>
</fieldset>

Сценарій:

    $("input[type="radio"]").click(function (event) {
// If the button is selected.
if ($(this).hasClass("checked")) {
// Remove the placeholder.
$(this).removeClass("checked");
// And remove the selection.
$(this).removeAttr("checked");
// If the button is not selected.
} else {
// Remove the placeholder from the other buttons.
$("input[type="radio"]").each(function () {
$(this).removeClass("checked");
});
// And add the placeholder to the button.
$(this).addClass("checked");
}
});

Отже, якщо позначено 21, і я натискаю 22, 21 слід зняти прапорець

Відповіді:

Якщо ви хочете, щоб група радіостанцій у тому самому наборі полів діяла як радіогрупа, ви можете просто зробити

 $("input[type="radio"]").click(function (event) {
$(this).addClass("checked");
$(this).siblings("input[type="radio"]").prop("checked", false).removeClass("checked")
});

Демо: Скрипка

Використовуйте значення перемикача, щоб передати ідентифікатор і дати їм все те саме ім'я.

<input type="radio" id="r21" value="21" name="radiobtns">
<label for="r21">21</label>

Тоді вам не потрібен jQuery.

Спробуйте цей код, все перемикач будене позначено, крім натиснутого. Як сказав Арон П. Джонні, якщо ви хочете згрупувати всі перемикачі з певним запитанням та відповіддю, тоді замість нього надішліть його відповідь.

$("input[type="radio"]").click(function (event) {
$("input[type="radio"]").prop("checked",false);
$(this).prop("checked",true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<fieldset>
<input type="radio" name="21">
<label for="21">Answer 21</label>
<input type="radio" name="22" class="checked">
<label for="22">Answer 22</label>
<input type="radio" name="23" class="">
<label for="23">Answer 23</label>
<input type="radio" name="24">
<label for="24">Answer 24</label>
</fieldset>

So if 21 is checked and I click 22, 21 should uncheck якщо це те, що ви хочете, вам насправді не потрібен jQuery ..

<fieldset>
<input type="radio" name="radio_button">
<label for="21">Answer 21</label>
<input type="radio" name="radio_button" class="checked">
<label for="22">Answer 22</label>
<input type="radio" name="radio_button" class="">
<label for="23">Answer 23</label>
<input type="radio" name="radio_button">
<label for="24">Answer 24</label>
</fieldset>

просто переконайтесь, що всі вони мають одне і те ж ім’я ..