テキストをクリックして、対応するラジオボタンを選択します

Question 1

PHPを使用してクイズWebアプリケーションを作成しています。各質問は個別に構成され、ユーザーが自分の回答を選択できるようにするため<label>に使用radio buttonsする4つの可能な選択肢があります。1つの質問の現在の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>

スニペットを展開

2つの要素が同じIDを持つことは決してないことに注意してください。このname属性は、ラジオボタンがグループとして機能し、一度に1つの選択のみを許可するように使用されます。

Question 3

ネイサンの答えによると、ラジオボタンとラベルの間に少しクリックできないスペースがあるようです。それらをシームレスに参加させる方法は次のとおりです（この記事を参照）。

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

これを直前に書いたコードに追加し、2番目のラベルをクリックすると、ラジオも選択されます。

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