javascript - jQuery - 在另一个 div 中打开图像父链接

Question

我有一个轮播，当单击图像时，我想获取图像的来源并在页面上的另一个 div 中打开它，“大图像”

$('.gallery-viewport-ext ul li a img').on('click', function () {
     alert($(this).parent('a').attr('src');)
 return false;  
});

我一开始只是想提醒 src 我确定我一定做错了什么？

<div id="tabs1-ext">
<section class="gallery-viewport-ext">
        <ul>
            <li><a href="_includes/images/slide-1.jpg"><img src="_includes/images/slide-1.jpg" alt="image" /></a></li>
            <li><a href="_includes/images/slide-2.jpg"><img src="_includes/images/slide-2.jpg" alt="image" /></a></li>
            <li><a href="_includes/images/slide-3.jpg"><img src="_includes/images/slide-3.jpg" alt="image" /></a></li>
            <li><a href="_includes/images/slide-1.jpg"><img src="_includes/images/slide-1.jpg" alt="image" /></a></li>
            <li><a href="_includes/images/slide-2.jpg"><img src="_includes/images/slide-2.jpg" alt="image" /></a></li>
            <li><a href="_includes/images/slide-3.jpg"><img src="_includes/images/slide-3.jpg" alt="image" /></a></li>
        </ul>
        <a id="simplePrevious"><img src="_includes/images/larr.png" alt="Left Arrow" /></a>
        <a id="simpleNext"><img src="_includes/images/rarr.png" alt="Right Arrow" /></a>
    </section>

<div class="big-image"><</div>

我是 jQuery 新手，所以请原谅我的天真！

Answer 1

它应该是attr('href'), 而不是src, 也应该删除后面的分号attr()

alert($(this).parent('a').attr('href'))

编辑：

$('.gallery-viewport-ext ul li a img').on('click', function () {
     $('.big-image').html($(this).parent().html());
     return false;  
});

或者

$('.gallery-viewport-ext ul li a').on('click', function () {
     $('.big-image').html($(this).html());
     return false;  
});

Answer 2

为什么不使用链接而不是 img

$('.gallery-viewport-ext ul li a').on('click', function () {
     alert($(this).attr('href'));
     var $bigImg = $("<img />").attr("src", $(this).attr('href'));
     $(".big-image").html($bigImg);
     event.preventDefault();
 });

Answer 3

下面将图像添加到大 div 中。

$('.gallery-viewport-ext ul li a img').on('click', function (event) {
 event.preventDefault();
 $('.bigimage').html('').append($('<img</img>').attr('src',$(this).parent('a').attr('href')));
});