Question

点击链接后应立即更改图像。如何用javascript和html实现这一点？我已经尝试并收集了信息并提出了代码

    <script type="text/javascript">
      function changeImage(element) {
      document.getElementById('imageReplaceTel').src = element;}
    </script>

<a href={{callphonenumber}} style="color:white" onclick="changeImage({{asset('bundles/testProject/images/telephoneSelected.png')}})">
    <img src="{{asset('bundles/testProject/images/telephone.png')}}" width="54px" height="54px" id="imageReplaceTel" alt="Images"></img></a>

我希望这会起作用，但它失败了，我可能会遗漏一些东西，因为我是javascript的初学者。感谢

Answer 1

使用javascript和html，它看起来像这样

<script type="text/jscript">
function Changetheimage() {
    document.getElementById("img1").src = "imagefoldername/Imagename2.jpg";
}
</script>
</head>
<body>
<a onclick="Changetheimage()">click here</a>
<img src="imagefoldername/Imagename1.jpg" id="img1" alt="" />

注意： “Img1”必须替换为您要更改的图像的ID 必须将javascript中的“imagefoldername / Imagename2.jpg”更改为要显示的新图像的目录并且“imagefoldername / Imagename1.jpg”必须更改为当前显示的图像

Answer 2

最好的方法是使用图片sprite.onclick只需通过javascript更改精灵坐标。

点击链接时如何切换图像？

2 个答案: