我试图以这样一种方式编码，当用户点击图像时，放大的图像会弹出。

它没有给我任何错误，但它也没有反应。我做错了什么吗？

$(document).ready(function() {
  $(".img-thumbnail").on("click", function() {
    var Popup = document.createElement("span");
    Popup.setAttribute("class", "img-popup");
    Popup.innerHTML = this;
    this.insertAdjacentElement("beforeend", Popup);
  });
});

.img-popup {
  width: 50%;
  height: auto;
  border-style: groove;
  background: center;
  position: relative;
}

<代码><；script SRC=“ https：//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js ”>；<；/script>；<；图>；<；IMG CLASS=“ Double，IMG-Popup，IMG-Thumbnail ” SRC=“ https：//via.placeholder.com/200 ” alt=“ Poodle ” title=“查看大图..”/>；<；figcaption Class=“ caption1 ”>；标准贵宾犬<；/figcaption>；<；/图>；

顺晟科技：

从你的问题来看，并不完全清楚你想要实现什么。但是，既然你提到你想创建一个弹出窗口，我希望你有一个专门的元素（<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <figure> <img class="double, img-popup, img-thumbnail" src="https://via.placeholder.com/200" alt="Poodle" title="View larger image..." /> <figcaption class="caption1">Standard Poodle</figcaption> </figure>）来展示你的放大图像。

因此，在下面的示例中，有一个默认情况下隐藏的div元素。由于您已经在使用jQuery，根据示例中的$('.img-thumbnail')判断，您可以使用一些默认的jQuery函数来向div元素添加和删除图像。也隐藏和显示它。单击缩略图时添加图像，单击放大图像时删除图像。

也不要用逗号分隔HTML元素中的类！

#image-pop-up

$(document).ready(function(){
    $('.img-thumbnail').on('click', function() {
        $('#image-pop-up').prepend('<img src=' + $(this).attr('src') + ' id="enlarged-image" />');
        $('#image-pop-up').show();
    });
    
    $('#image-pop-up').on('click', function() {
        $(this).hide();
        $('#enlarged-image').remove();
    });
   
});

<代码><；script SRC=“ https：//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js ”>；<；/script>；<；DIV ID=“ image-pop-up ”>；<；/DIV>；<；图>；<；IMG CLASS=“双IMG-缩略图” SRC=“ https：//www.fillmurray.com/400/300 ” ALT=“贵宾犬”title=“查看大图..”/>；<；figCaption Class=“ caption1 ”清单1<；/figCaption>；<；/图>；<；图>；<；IMG CLASS=“双IMG-缩略图” SRC=“ https：//www.fillmurray.com/400/500 ” ALT=“贵宾犬”title=“查看大图..”/>；<；figCaption Class=“ caption1 ”清单2<；/figCaption>；<；/图>；<；图>；<；IMG CLASS=“双IMG-缩略图” SRC=“ https：//www.fillmurray.com/200/300 ” ALT=“贵宾犬”title=“查看大图..”/>；<；figCaption Class=“ caption1 ”>；清单3<；/figCaption>；<；/图>；