0

シンプルな JavaScript フォト ギャラリーを作成しようとしています。最初に、HTML で使用したい画像のサムネイルを使用しました。HTMLはこんな感じ

            <div id="imgs">
               <img onClick="gallery()" src="images/photo25thumbnail.jpg">
               <img onClick="gallery()" src="images/photo43thumbnail.jpg">
               <img onClick="gallery()" src="images/photo46thumbnail.jpg">
               <img onClick="gallery()" src="images/photo47thumbnail.jpg">
               <img onClick="gallery()" src="images/photo61thumbnail.jpg">
             </div>
       <div id="display">

        <div>
       </body>
        </html>   

そのため、ユーザーが画像をクリックすると、関数ギャラリーがトリガーされます。ここに私のJavaScriptコードがあります

                function gallery()

 {
var img1 = document.getElementById("display")
.innerHTML="<a href='#'><img src='images/photo25.jpg'></a>";
var img2 = document.getElementById("display")
.innerHTML ="<a href='#'><img src='images/photo43.jpg'></a>";
var img3 = document.getElementById("display")
.innerHTML="<a href='#'><img src='images/photo46.jpg'></a>";
var img4 = document.getElementById("display")
.innerHTML="<a href='#'><img src='images/photo47.jpg'></a>";
var img5 = document.getElementById("display")
.innerHTML="<a href='#'><img src='images/photo61.jpg'></a>";
        }

しかし、何らかの理由で画像の 1 つをクリックすると、div コンテナーの最後の画像のみが表示されます。私は明らかに何か間違ったことをしていますが、私は正しい方向に進んでいるように感じます. 助けてください。

4

3 に答える 3