Clicar no texto para selecionar o botão de opção correspondente

Question 1

Estou criando um aplicativo da web de questionário usando PHP. Cada pergunta é composta por uma pergunta separada <label>e tem 4 opções possíveis, radio buttonsque permitem ao usuário selecionar sua resposta. O HTML atual para uma única pergunta se parece com:

<label for="349">What is my middle name?</label>
<br>
<input id="349" type="radio" value="1" name="349">Abe
<br>
<input id="349" type="radio" value="2" name="349">Andrew
<br>
<input id="349" type="radio" value="3" name="349">Andre
<br>
<input id="349" type="radio" value="4" name="349">Anderson
<br>

Gostaria que o usuário tivesse a opção de clicar no texto associado ao botão de rádio. No momento, o usuário só pode clicar no próprio botão de rádio - o que considero uma tarefa bastante complicada.

Eu li Incapaz de selecionar uma opção de botão de rádio particular clicando no texto da escolha e os pontos de sugestão para fazer com que os atributos fore iddas tags correspondam. Eu fiz isso e ainda não funciona.

Minha pergunta é: eu gostaria de poder clicar no texto de um <input type="radio">objeto, ao invés de apenas poder selecionar o próprio botão de rádio. Sei que li sobre isso antes, mas não consigo encontrar nenhuma solução para o meu problema. Qualquer ajuda ou sugestão são muito apreciadas!

Question 2

Em seu código, você tem um rótulo no próprio formulário. Você deseja colocar etiquetas em cada grupo de rádio individual, conforme mostrado abaixo.

<form>
  <p>What is my middle name?</p>
  <br>
  <input id="349" type="radio" value="1" name="question1">
  <label for="349">Abe</label>
  <br>
  <input id="350" type="radio" value="2" name="question1">
  <label for="350">Andrew</label>
  <br>
  <input id="351" type="radio" value="3" name="question1">
  <label for="351">Andre</label>
  <br>
  <input id="352" type="radio" value="4" name="question1">
  <label for="352">Anderson</label>
  <br>
</form>

Expandir trecho

Você deve ter em mente que dois elementos nunca devem ter o mesmo ID. O nameatributo é usado para que os botões de opção funcionem como um grupo e permitam apenas uma única seleção por vez.

Question 3

Parece haver um pequeno espaço que não pode ser clicado entre o botão de rádio e o rótulo se feito de acordo com a resposta de Nathan . Veja como fazer com que eles se unam perfeitamente (consulte este artigo ):

<form>
    <p>What is my middle name?</p>
    <br>
    <label><input id="349" type="radio" value="1" name="question1">Abe</label>
    <br>
    <label><input id="350" type="radio" value="2" name="question1">Andrew</label>
    <br>
    <label><input id="351" type="radio" value="3" name="question1">Andre</label>
    <br>
    <label><input id="352" type="radio" value="4" name="question1">Anderson</label>
    <br>
</form>

Question 4

A etiqueta do rótulo deve estar em torno de cada resposta, por exemplo, em torno de Abe, Andrew, etc ... e deve ser exclusiva para cada um deles.

Question 5

O aninhamento da tag de entrada na tag do rótulo garante que o rótulo apareça ao lado do botão de opção. Com as abordagens anteriores sugeridas, você pode colocar a etiqueta do rótulo em qualquer lugar dentro do arquivo html e ele selecionará o botão de opção associado quando clicado. Veja isso:

<html>
<body>

<form>
  <p>What is my middle name?</p>
  <br>
  <input id="349" type="radio" value="1" name="question1">

  <br>
  <input id="350" type="radio" value="2" name="question1">
  <label for="350">Andrew</label>
  <br>
  <input id="351" type="radio" value="3" name="question1">

  <br>
  <input id="352" type="radio" value="4" name="question1">
  <label for="352">Anderson</label>
  <br>
</form><br/>
<p>This is a paragraph</p>
  <label for="349">Abe</label><br/>
  <label for="351">Andre</label>
  
</body>
</html>

Expandir trecho

Em vez disso, fazer dessa forma elimina esta falha:

<form>
  <p>What is my middle name?</p>
  <br>
  
  <label>
    <input id="349" type="radio" value="1" name="question1"/>Abe
  </label>
  <br>
  
  <label>
    <input id="350" type="radio" value="2" name="question1"/>Andrew
  </label>
  <br>
  
  <label>
    <input id="351" type="radio" value="3" name="question1"/>Andre
  </label>
  <br>
  
  <label>
    <input id="352" type="radio" value="4" name="question1"/>Anderson
  </label>
  <br>
</form>

Expandir trecho

Question 6

Você pode fazer assim

 <label for="1">hi</label>
 <input type="radio" id="1" />

Portanto, se você clicar no texto ou rótulo, ele seleciona o botão de rádio. Mas se você fizer isso ...

<label for="1">//</label>

e você adiciona isso ao código que escrevi antes disso, então, se você clicar no segundo rótulo, ele também selecionará o rádio.

Question 7

Venho fazendo isso há anos, mas nenhum desses funciona para mim, usando variáveis.

    echo "<input type='radio' name='student' id='$studentID' value='$studentID'>
        <label for='$studentID'>$fname</label> $lname<br />\n";
    echo "<input type='radio' name='student' id='$studentID' value='$studentID'>
        <label for='$studentID'>$fname $lname</label><br />\n";

e aqui está a fonte:

        <input type='radio' name='student' id='986875' value='986875'>
        <label for='986875'>John</label> Brown<br />