使用 javascript 更改图像源答案

【问题标题】：changing image source with javascript使用 javascript 更改图像源
【发布时间】：2013-03-23 09:52:42
【问题描述】：

我是 javascript 新手，发现这个可以解决我的问题：

但是这个例子对我不起作用。

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

还有

<table align=left width="896px" class="tableCategories">
  <tr class="trCategories">
    <td class="tdCategories">
      <img id="img1" src="./icon/menu/Essen3.png" onclick='changeImage(Shopping3.png);'/>
    </td>
  </tr>
</table>

因此，如果我单击图像，它不会自行改变。图片的路径是正确的。我做错了什么？

【问题讨论】：

在 Shopping3.png 周围添加双引号
更改为 onclick='changeImage("Shopping3.png");
调用函数时在文件名两边加上引号...

标签： javascript image src

【解决方案1】：

改变

<img id="img1" src="./icon/menu/Essen3.png" onclick='changeImage(Shopping3.png);'/>

到

<img id="img1" src="./icon/menu/Essen3.png" onclick='changeImage("./icon/menu/Shopping3.png");'/>

一个更好的 javascript 函数将是可重用的。试试这个：

function changeImage(obj,img) {
  obj.src = img;
}

以及以下 HTML 代码：

<img id="img1" src="./icon/menu/Essen3.png" onclick='changeImage(this,"./icon/menu/Shopping3.png");'/>

【讨论】：

【解决方案2】：

您需要将 Shopping3.png 作为字符串传递。

<img id="img1" src="./icon/menu/Essen3.png" onclick="changeImage('Shopping3.png');"/>

【讨论】：