Javascript-根据所选图像更改图像

Javascript - Change image according to image selected

本文关键字：图像 Javascript-      更新时间：2024-02-22

我使用的是asp.net mvc。

我有两个图标/图片如下：

<div class="gallery-preview-img" id="forest">
                                    <a href="#"><img onclick="changeImage()" src="~/Content/themes/base/images/forest_icon.png"></a>
                                </div>
<div class="gallery-preview-img" id="urban">
                                    <a href="#"><img onclick="changeImage()" src="~/Content/themes/base/images/urban_icon.png"></a>
                                </div>

脚本：

        $(function changeImage() {
        $('#forest').click(function () {
            if (!(document.getElementById('forest').src.match('forestG'))) {
                document.getElementById('forest').src = "~/Content/themes/base/images/forestG.png";
                if (!(document.getElementById('urban').src.match('urban_icon')) {
                    document.getElementById('urban').src = "~/Content/themes/base/images/urban_icon.png";
                }
            }
            document.getElementById('env').value = 'Forest';
        })
        $('#urban').click(function () {
            if (!(document.getElementById('urban').src.match('urbanG')) {
                document.getElementById('urban').src = "~/Content/themes/base/images/urbanG.png";
                if (!(document.getElementById('forest').src != 'forest_icon')) {
                    document.getElementById('forest').src = "~/Content/themes/base/images/forest_icon.png";
                }
            }
            document.getElementById('env').value = 'Urban';
        });
    }
 });

但是，图片/图标没有变化。你知道我做错了什么吗？

这里有一个链接，我相信你正在尝试做什么。我认为你现在的方法有点太复杂了。希望这能帮助

https://jsfiddle.net/stevenkaspar/qs8L20wt/

<img onclick='changeImage(event);' src='/path/to/image.png'/>
function changeImage(event){
  document.getElementById('destination').src = event.target.src;
}
相关文章：