Question

我想将点击的图像显示为div。 HTML：

<img src="image1.jpg" class="image">
<img src="image2.jpg" class="image">
<div>
    <img id="source">
</div>

JS：

$('img.image').click(function(){
    var source= $(this).attr('src');
    document.getElementById("source")=source;
});

此外，图像应随着淡入淡出的动画效果而改变。

我该怎么做？

提前致谢。

Answer 1

缺少src

$('img.image').click(function(){
  var source= $(this).attr('src');
  document.getElementById("source").src=source; // --- Here
});

Answer 2

您可以尝试使用以下代码。

为要选择的图像提供相同的类名
选择目标图像元素，然后使用src方法设置图像attr。

   $('.imageToBeClicked').click(function(evt){
        $('#source').attr("src", evt.target.src);
    });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <img src="http://placehold.it/120x120&text=image1" class="imageToBeClicked"/>
    <img src="http://placehold.it/120x120&text=image2" class="imageToBeClicked"/>
    <div>
        <img id="source">
    </div>

在div javascript HTML中显示单击的图像

2 个答案: