Question

我有这个小功能，其中图像在单选按钮选择上发生变化，并且工作正常。

现在的问题是，我希望该功能可用于第二个＆＃34;图像滑块＆＃34;。问题是，当我使用第二个滑块的单选按钮时，第一个滑块的图像会发生变化（当然，因为它们是相同的ID。）我试图应用多个这样的ID：

function changeImage(imgName) {
     image = document.getElementById('image1', 'image2');
     image.src = imgName;
}

......但那没有用。

Fiddle here

有人可以帮我吗？

Answer 1

试试这个：

<强> HTML ：

<img src="http://placehold.it/100x100" name="image1" id="image1">
<br>
<input type="radio" name="image1" onclick="changeImage('http://placehold.it/100x100',this);" checked>
<input type="radio" name="image1" onclick="changeImage('http://placehold.it/200x200',this);">
<input type="radio" name="image1" onclick="changeImage('http://placehold.it/300x300',this);">
<br>
<br>
<br>
<img src="http://placehold.it/100x100" name="image2" id="image2">
<br>
<input type="radio" name="image2" onclick="changeImage('http://placehold.it/100x100',this);" checked>
<input type="radio" name="image2" onclick="changeImage('http://placehold.it/200x200',this);">
<input type="radio" name="image2" obj.name onclick="changeImage('http://placehold.it/300x300',this);">

<强> JS ：

function changeImage(imgName, obj) {
    image = document.getElementById(obj.name);
    image.src = imgName;
}

<强> Fiddle

单选按钮更改图像（多个ID？）

1 个答案: