"Javascript"中的单选按钮设置

Question

我有一组三个单选按钮连接一组三个图像 - 即{image1,radioBtn1},{image2,radioBtn2},{image3,radioBtn3}.

我正在尝试执行以下操作:当我单击一个图像时,连接到此按钮的单选按钮会自动变为"已选中"(例如:当我单击图像3时,将检查radioBtn3)

我试过以下代码:

HTML:

<input type="radio" id="radioBtb1" name="subject"/><a href="#"><img id="image1" src="../image/img3.png" height="150px"/></a>
<input type="radio" id="radioBtb2" name="subject"/><a href="#"><img id="image2" src="../image/img3.png" height="150px"/></a>
<input type="radio" id="radioBtb3" name="subject"/><a href="#"><img id="image3" src="../image/img3.png" height="150px"/></a>

使用Javascript:

function selectSubject(){
    if(document.getElementById('image1'))
        document.getElementById(radioBtb1).checked=true;
    if(document.getElementById('personal'))
        document.getElementById(radioBtb2).checked=true;
    if(document.getElementById('image3'))
        document.getElementById(radioBtb3).checked=true;
}

但那根本不起作用.

Answer 1

您可以使用<label>标签轻松完成此操作.只需使用以下语法:

<label>
    <input type="radio" id="radioBtb1" name="subject"/>
    <img id="image1" src="../image/img3.png" height="150px"/>
</label>
<label>
    <input type="radio" id="radioBtb2" name="subject"/>
    <img id="image2" src="../image/img3.png" height="150px"/>
</label>
<label>
    <input type="radio" id="radioBtb3" name="subject"/>
    <img id="image3" src="../image/img3.png" height="150px"/>
</label>

这将自动完成您正在寻找的.