首先，我是Javascript的新手，但我有一些HTML / CSS经验。我一直在尝试为网站创建一个html / javascript图库; （在PHP中可能要容易得多，但出于安全原因，Web协调器在我们的服务器上禁用了PHP。）
无论如何我拥有的是一个页面，分别显示不同的div和2个iframe中的Album-list，Album-browser和Photo-viewer。我进行了设置，以便当有人点击相册列表中的相册时，会在相册浏览器部分打开一个页面（iframe：“ browser-frame ”显示特定专辑中所有图像的缩略图）。我一直在尝试设置它，以便当有人点击相册浏览器中的图像时，图像将出现在照片查看器部分（iframe：“ viewer-frame “显示照片本身”。
我不希望 viewer-frame 中的照片大于 viewer-frame 所以我为viewer-frame创建了一个页面，它将图像放在一个带有一组设定尺寸（在样式表中定义）的div中，如下所示：
...<body>
<div class="photoview">
<img id="viewed_image" class="large" src="images/album1/1.jpg" />
</div>
</body>...
然后我创建了一个脚本，将图像src更新为变量： image_to_be_viewed 并将其称为image-changer.js
// JavaScript Document
{
var image_to_be_viewed="images/album1/1.jpg";
document.getElementById("viewed_image").src=image_to_be_viewed;
}
并在查看器框架页面中添加了一个脚本，如下所示：
...<body>
<div class="photoview">
<img id="viewed_image" class="large" src="images/album1/1.jpg" />
<script src="image-changer.js"></script>
</div>
</body>...
现在我希望图库工作，以便在浏览器框架中加载的页面中，每当单击其中一个图片时，全局变量“image_to_be_viewed”的值将更改为单击图像的来源如下：
<body>
<div class="photobrowse">
<img class="medium" src="images/album1/1.jpg" onClick="image_to_be_viewed='images/album1/1.jpg'"/>
<img class="medium" src="images/album1/2.jpg" onClick="image_to_be_viewed='images/album1/2.jpg'"/>
<img class="medium" src="images/album1/3.jpg" onClick="image_to_be_viewed='images/album1/3.jpg'"/>
</div>
</body>
它不起作用....
我正在处理的图库位于http://ptc.tamu.edu/test/gallery_directory/test_gallery.html 在查看器框架中加载所选图片的所有内容都可以正常工作（我正在 浏览器框架中默认加载的图片1,2,3上运行onlick事件 页面）（默认图片4和5只是在iframe中加载图片，但没有办法调整尺寸，它太大而被切断，我不希望这样）
我已经工作了一整天，我确信我在这里做错了但是我无法弄清楚到底是什么。我有一种感觉，它与更改全局变量有关： image_to_be_viewed 来自 浏览器框架 页面，但我想与专家确认像无头鱼一样徘徊我将继续尝试解决这个问题，但我认为可能会有一些专家帮助来加快这个过程。
答案 0 :(得分：0)
onclick触发器应该是javascript函数调用。
e.g。 onclick="changeImg('images/album1/1.jpg')"
函数本身应该是这样的
function changeImg (image_to_be_viewed) {
document.getElementById("viewed_image").src = image_to_be_viewed;
}
答案 1 :(得分：0)
function changeImg (image_to_be_viewed) {
window.parent.viewer_frame.document.getElementById("viewed_image").src = image_to_be_viewed;
}