多个changeImage实例
多个changeImage实例
提问于 2014-02-07 18:08:27
希望有人能帮我。我使用的是一个JS图像比较脚本，它显示了两个并排显示的图像，用户可以比较它们。它的工作方式如下：
<div id="container1">
<!-- The before image is first -->
<img id="img" src=" http://placehold.it/400x200&text=1" />
<!-- The after image is last -->
<img id="img-alt" src="http://placehold.it/400x200&text=2" />
</div>脚本将第一个img作为左图像，第二个img作为右侧图像。我添加了两个ID，因为我已经设置了按钮，我希望它们在两边都是changeImage，所以这两个图像不是静态的，可以从缩略图库(根据用户的选择)选择多个图像并进行比较。
我在这里发现了一些代码，这会影响到左边。我还添加了一个按钮，允许改变左侧。
<script type="text/javascript">
function changeImage(a) {
document.getElementById("img").src=a;
}
</script>以及HTML：
Left side:
<button onclick='changeImage( "http://placehold.it/400x200&text=Left" );'>Left</button>
<button onclick='changeImage( "http://placehold.it/400x200&text=Left2");'>Left2</button>现在，我想创建另一组按钮，它会影响“img”类，如滑块HTML中所示--这会影响到右侧。我对Javascript的了解有限，如果我添加另一个脚本“document.getElementById(”img“).src=a；”右边没有任何变化。基本上，我喜欢影响右侧的按钮，比如：
Right side:
<button onclick='changeImage( "http://placehold.it/400x200&text=Right");'>Right</button>
<button onclick='changeImage("http://placehold.it/400x200&text=Right2");'>Right2</button>如何关联这些按钮来影响‘image’ID (第二个图像)？
我希望这是合理的。如果我需要澄清什么，请告诉我。
谢谢!
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-02-07 19:12:34
我不太确定这是不是你想要的，但请看看我做了-> 小提琴的例子
changeImage = function(elemId, source) {
document.getElementById(elemId).src=source;
}
<button onclick='changeImage("img-alt", "http://placehold.it/400x200&text=Right");'>Right</button>
<button onclick='changeImage("img", "http://placehold.it/400x200&text=Left" );'>Left</button>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21634795
复制相关文章
相似问题
腾讯云开发者
