Question

用户应该点击三个图像中的一个，无论是摇滚，纸张还是剪刀，当他们点击这三个选项中的一个时，它会将这三个图像右侧的图像更改为制作该形状的手的图像正如你在岩石，纸张，剪刀游戏中看到的那样。我似乎无法弄清楚如何设置onclick事件以将图像更改为单击图像的右侧。以下是我的代码示例。

（HTML）

<tr>
  <td onclick="clickRock()" id="rockClick"><img src="rock.jpg" alt="Rock"></td>      
  <td rowspan="3" id="change1"><img src="leftPaperHand.jpg" alt="Left Hand" height="350"></td>       
  <td rowspan="3" id="change2"><img src="rightRockHand.jpg" alt="Right Rock" height="350"></td>
</tr>

（JavaScript）的

 function clickRock(args) {
   img= document.getElementById("change1");
   img.src="leftRockHand.jpg"
 }

Answer 1

这样写的功能会起作用。这样您就可以将目标图像ID作为第一个参数，将要替换它的图像作为第二个参数。

function clickRock( targetImg, chgeImg ) {
    document.getElementById(targetImg).src = changeIng;
}

document.getElementById("rockClick").addEventListener("click", clickRock( "change2", "myNewImage.jpg") );

然后你会把你的onClick取出来。这不灵活。如果我有更多关于你要做什么的详细信息，这可能会奏效。

如何使用onclick事件单击一个图像并让它在同一网页上更改另一个图像？

1 个答案: