Question

我想创建多个模式，显示带有不透明黑色背景的图像特写。第一个模式＆＃34; landscape_img_1＆＃34;工作得很好。但是，第二个模态可以工作，但只有不透明的黑色背景而没有图像。我在这做错了什么？

<div id="myModal_1" class="modal">
    <span class="close">&times;</span>
    <img class="modal-content" id="img01">
</div>
<div id="myModal_2" class="modal">
    <span class="close">&times;</span>
    <img class="modal-content" id="img02">
</div>

<script>
    // Modal function 1
    var modal = document.getElementById("myModal_1");
    var img = document.getElementById("landscape_img_1");
    var modal_img = document.getElementById("img01");
    img.onclick = function(){
        modal.style.display = "block";
        modal_img.src = this.src;
    }

    // Modal function 2
    var modal_2 = document.getElementById("myModal_2");
    var img_2 = document.getElementById("landscape_img_2");
    var modal_img_2 = document.getElementById("img02");
    img_2.onclick = function(){
        modal.style.display = "block";
        modal_img_2.src = this.src;
    }

    var span = document.getElementsByClassName("close")[0];
    span.onclick = function(){
        modal.style.display = "none";
    }
</script>

莫代尔不起作用

0 个答案: