javascript - 单击时使用 Javascript 加载图像

Question

我正在尝试做与上图类似的事情，我正在使用 Wordpress，我将使用 PHP 构建 HTML 输出，但当单击缩略图图像时，我需要将更大的图像加载到大图像插槽中。

我发现一个网站 pof.com 使用下面的方法，但是当我尝试它时，出现以下错误。请帮忙？

<script>
function B(strNewImage, caption) {
  document.images['MP'].src = strNewImage;
  document.getElementById("icaption").innerHTML = caption;
}
</script>

<img src="http://default_image.jpg" border="0" id="mp" name="MP">

<a href="javascript: B('image_2.jpg','test')"><img src="thumbnails/image_2.jpg" border="0"></a>
<a href="javascript: B('image_3.jpg','test')"><img src="thumbnails/image_3.jpg" border="0"></a>
<a href="javascript: B('image_4.jpg','test')"><img src="thumbnails/image_4.jpg" border="0"></a>
<a href="javascript: B('image_5.jpg','test')"><img src="thumbnails/image_5.jpg" border="0"></a>

错误:

Uncaught ReferenceError: B is not defined

Answer 1

您的代码正在运行，DEMO ，这都与您定义 B 函数的位置有关。或者可能由于未定义的脚本标记类型而无法正常工作。

<script type="text/javascript">
function B(strNewImage, caption) {
  document.images['MP'].src = strNewImage;
  document.getElementById("icaption").innerHTML = caption;
}
</script>