单击文本以选择相应的单选按钮

Question 1

我正在使用PHP创建测验Web应用程序。每个问题由一个单独的部分组成<label>，有4个可能的选择，radio buttons用于允许用户选择他/她的答案。单个问题的当前HTML如下所示：

<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>

我希望用户可以选择单击与单选按钮关联的文本。 现在，用户只能单击单选按钮本身-我发现这是一项非常繁琐的任务。

我读到“无法选择特定的单选按钮选项”，方法是单击选择文本，并且建议指向标记的for和id属性匹配。我已经做到了，但仍然行不通。

我的问题是：我希望能够单击<input type="radio">对象的文本，而不是只能选择单选按钮本身。 我知道我之前已经阅读过有关此问题的信息，但似乎找不到解决我问题的方法。任何帮助或建议，不胜感激！

Question 2

在您的代码中，您在表单本身上有一个标签。您希望在每个单独的无线电组上放置标签，如下所示。

<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>

展开摘要

您应该记住，两个元素永远不应具有相同的ID。使用该name属性是为了使单选按钮作为一个组起作用，并且一次只允许一个选择。

Question 3

如果根据Nathan的回答，单选按钮和标签之间似乎会有一点不可点击的空间。这是使他们无缝连接的方法（请参阅本文）：

<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

标签应位于每个答案的周围，例如安倍，安德鲁等周围，并且每个标签都必须唯一。

Question 5

将输入标签嵌套在标签标签内可确保标签显示在单选按钮旁边。建议使用较早的方法，您可以将标签标签放在html文件中的任何位置，单击后它将选择关联的单选按钮。看一下这个：

<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>

展开摘要

这样做可以消除此缺陷：

<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 6

你可以这样

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

因此，如果单击文本或标签，它将选择单选按钮。但是如果你这样做

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

然后将其添加到我之前编写的代码中，然后单击第二个标签，它也会选择收音机。

Question 7

我已经做了多年了，但是这些对我来说都没有使用变量。

    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";

这是来源：

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