javascript - 单击更改主图像不起作用

Question

当我点击它时，我试图更改我的主图像，我做了console.log，它给了我这个错误Uncaught TypeError: Cannot read property 'src' of null ，我的 this 属性做错了什么？如何单击我的 img-container 以显示为主图像？提前致谢!

我的div

<ul class="list-inline ">
<div class="main_image"><img src="some.jpg" ></div>

<li><div class="img-container"><img src="some.jpg" ></div></li>
<li><div class="img-container"><img src="some.jpg" ></div></li>
</ul>

jquery

<script>
$( document ).ready(function() {
$(".img-container img").click(function() {
    $(".main_image img").attr("src", $(this).attr("src"));
});
});
</script>

Answer 1

这不是您问题的答案，因为我无法重现该问题，但我会给您这个替代解决方案...

$( document ).ready(function() {
$(".img-container img").click(function() {
    //$(".main_image img").attr("src", $(this).attr("src"));
    var img = $(this).clone();
    $(".main_image img").remove();
    $(".main_image").append(img);
});
});

示例如下:jsfiddle