Question

我是Java的新手，需要构建一个图库。我有一个图像目录：每个类别都有一个缩略图;每个类别都有三个图像。

过程：点击缩略图，bigPic更改其src以显示您单击的图像。可以点击bigPic下面的三个点来查看该类别中的其他图像（因此，如果选择了另一个缩略图，它们传递给bigPic的srcs也会改变）

我尝试了一些东西并环顾四周但似乎无法使其发挥作用。以下是我到目前为止的情况：

    <script>
        function backColor(a) {
            document.getElementById("bigPic").src = a;
        }
        function varE(e){
            var chosen = e;
            document.getElementsByName("firstDot").id = chosen;
        }
        function setM(m) {
            var chosenImage = m.id;
            document.getElementById("bigPic").src = chosenImage;
        }
    </script>

bigPic：

    <img class="bigPic" id="bigPic">

缩略图：

    <img class="thumb" src="categoryImageSRC" onclick="backColor('anotherImageSRC'); varE('otherImageSRC')">

点/圆圈，显示类别中的另一个图像：

    <img name="firstDot" id="" src="dotImageSRC" onclick="setM(this)">

非常欢迎任何关于如何进行此操作，示例和更正的想法！谢谢！

Answer 1

按名称获取元素会返回一个元素数组，因此您需要在varE函数中更改此行

document.getElementsByName("firstDot").id = chosen;

到

document.getElementsByName("firstDot")[0].id = chosen;

图库缩略图

1 个答案: