单击标签选择单选按钮

Question

如何在单选按钮前的两个标签中的任意一个被点击时选择该单选按钮？

我有以下单选按钮的代码：

<div class="label_main" style="width:350px">
    <div class="label_radio">
      <input type="radio" name="group1" id="group1" value="0" 
       <?php if($r0==0) { ?>
       checked="checked"
       <?php  } ?>
      />
    </div>
    <div class="label_top">
      <label for="group1">First Option </label>
    </div>
    <div class="label_desc">
      <label for="group1">This is first option </label>
    </div>
  </div>
      </div> 

  <div class="label_main" style="width:350px">
    <div class="label_radio">
      <input type="radio" name="group1" id="group1" value="1"
       <?php if($r0==1) { ?>
       checked="checked"
       <?php  } ?>
      />
    </div>
    <div class="label_top">
      <label for="group1">Second Option </label>
    </div>
    <div class="label_desc">
      <label for="group1">This is Second Option </label>
    </div>
  </div>          

我遇到的唯一问题是，如果我更改单选按钮的ID，它可以正常工作，但我需要相同的ID，因为我需要在最后保存其值到数据库中。

- air

---

单选按钮应该有相同的“name”，但不能有相同的“id”。HTML要求“id”必须是唯一的。 - Powerlord

Answer 1

你把name属性和id属性混淆了。

它们应该拥有相同的name，但不同的id。

例如：

<input type="radio" name="group1" id="group1_0" value="0">
<input type="radio" name="group1" id="group1_1" value="1">

<label for="group1_0">CLicky 0</label>
<label for="group1_1">CLicky 1</label>

- Greg

Answer 2

输入的ID和名称不必相同。将第二个单选框的名称更改为其他内容，并更改第二个标签的“for”属性以匹配该ID。 当您提交表单到服务器时，您将通过“name”属性获取该值。服务器对ID一无所知。

- Jan Hančič

---

jQuery（或JavaScript总体）与此无关。 id不是标签，而是属性。 而且，一旦您提交到服务器，您将通过它们的名称访问字段的值，而不是id。因为，正如我所说，服务器对ID一无所知。 - Jan Hančič