點擊圖片並選擇收音機不工作

Question

我有這個代碼，當我點擊它的圖像時無法讓它選擇收音機。

我我錯過了什麼？

下面是當前的代碼：

<label style="display: inline; " for="test1"> 

<img src="images/image1.jpg" /> 

<input checked="checked" class="select_control" id="select1" name="test1" type="radio" value="value1" /> 
</label> 

<label style="display: inline; " for="test2"> 

<img src="images/image2.jpg" /> 

<input checked="checked" class="select_control" id="select2" name="test2" type="radio" value="value2" /> 
</label> 

Answer 1

在標籤的for屬性應該匹配輸入的id而不是name。 name用於分組單選按鈕和複選框（當它們在一個組中時它們的名稱相同，因此選中其中一個將會取消選中另一個）。

<label for="test1"> 
    <img src="image1.jpg" /> 
    <input id="test1" name="test" type="radio" value="value1" /> 
</label> 
<label for="test2"> 
    <img src="image2.jpg" /> 
    <input id="test2" name="test" type="radio" value="value2" /> 
</label> 

這是你的代碼的工作示例：http://jsfiddle.net/nXb5a/

Answer 2

的for屬性應該是它指的是元素的ID，並且兩個單選按鈕應具有相同的名稱（假設你希望他們爲一個基團）：

<label style="display: inline; " for="select1"> 

<img src="images/image1.jpg" /> 

<input checked="checked" class="select_control" id="select1" name="test1" type="radio" value="value1" /> 
</label> 

<label style="display: inline; " for="select2"> 

<img src="images/image2.jpg" /> 

<input checked="checked" class="select_control" id="select2" name="test1" type="radio" value="value2" /> 
</label> 

Answer 3

的用於標籤的屬性應該引用輸入它是不是名字 見的id： http://jsfiddle.net/EtvLu/