Радио кнопки не включаются, почему?

Question

У меня есть следующие формы, где пользователи могут выбрать, чтобы ввести идентификатор или имя:.

<label for="ID"><input type="radio" name="Member" id="ID"> Member ID <input id="MemberID"></label><br/> 
<label for="Name"><input type="radio" name="Member" id="Name"> Last Name <input id="LastName"></label> 

Когда я нажимаю на «ID члена или Фамилия, это переключает радиокнопки Однако, когда я нажимаю на текстовые входы, это не имеет никакого влияния на радиокнопках

это ожидаемое поведение Если да, то есть ли способ настроить HTML, чтобы заставить его работать

Примечания:.? это не JavaScript вопрос

Fiddle: https://jsfiddle.net/3by5wqzw/

Answer 1

Да, это кажется ожидаемым поведением на хроме, краю microsoft и firefox на окнах 10 и на хроме для android lollipop. Вы можете использовать немного JavaScript, чтобы решить эту проблему:

<label for="ID"><input type="radio" name="Member" id="ID"> Member ID <input id="MemberID" onclick="document.getElementById('ID').checked = true;"></label><br/> 
 
<label for="Name"><input type="radio" name="Member" id="Name"> Last Name <input id="LastName" onclick="document.getElementById('Name').checked = true;"></label>

При нажатии на ввод текста, клиент будет автоматически проверять кнопку соответствия радио ищет его по его идентификатору.

В качестве альтернативы, вы можете поместить код Javascript в функции, поэтому она выглядит лучше и легче редактировать, если у вас есть много переключателей с вводом текста, связанный с ней:

function check_radio(element_id){ 
 
    document.getElementById(element_id).checked = true; 
 
}

<label for="ID"><input type="radio" name="Member" id="ID"> Member ID <input id="MemberID" onclick="check_radio('ID');"></label><br/> 
 
<label for="Name"><input type="radio" name="Member" id="Name"> Last Name <input id="LastName" onclick="check_radio('Name');"></label>

Answer 2

В обычном html типы входного сигнала радиосвязи не связаны ни с чем иным, кроме связанного с ним ярлыка. Поэтому любые другие текстовые поля ввода до или после должны быть подключены через какой-то javascript.

Answer 3

Думаю, я нашел ответ.

В w3 рекомендация гласит:

В HTML-документе элемент должен получать фокус от пользователя для того, чтобы стать активным и выполнять свои задачи

Вопрос в том, что, когда пользователь нажимает на ввод текста, радиокнопка теряет фокус и не активируется.

Источник (html4): http://www.w3.org/TR/html4/interact/forms.html#focus