Автоматическая отмена выбора радиокнопки через jQuery с разными именами

Question

У меня такое чувство, что это суперосновный вопрос, но поиск ничего не дал.

Урезанный HTML:

<input name="ID_1" type="radio" value="1" id="A01" /> A01<br>
<input name="ID_1" type="radio" value="2" id="A02" /> A02<br>

<input name="ID_2" type="radio" value="1" id="A01" /> A01<br>
<input name="ID_2" type="radio" value="2" id="A02" /> A02<br>

Допустим, пользователь нажимает на первое радио.

Затем пользователь нажимает на третье радио.

Я хочу, чтобы первое радио было отключено... и наоборот.

То же самое для второго радио и четвертого радио.

Спасибо!

Answer 1

Я изменил идентификаторы на классы. Затем логика запускается, когда изменяется любой переключатель. Он находит все переключатели одного и того же класса, исключает только что измененный и отменяет проверку другого с тем же классом.

$(':radio').on('change', e => {
  $('.'+ e.target.className).not(e.target).prop('checked', false);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<input name="ID_1" type="radio" value="1" class="A01" /> A01<br>
<input name="ID_1" type="radio" value="2" class="A02" /> A02<br>

<input name="ID_2" type="radio" value="1" class="A01" /> A01<br>
<input name="ID_2" type="radio" value="2" class="A02" /> A02<br>