jQuery替换scr

在我的站点中，我使用bootstrap3和bootsnipp作为lightbox

我的代码：

        <td>
            <a href="#" class="thumbnail" data-toggle="modal" data-target="#lightbox">
                <div id="full-size-image" >
                    <img src="{{ $result->get_cover('thumbs')}}" style="height: 50px;" alt="{{ $result->type->name }}">
                </div>
            </a>
        </td>

<div id="lightbox" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <button type="button" class="close hidden" data-dismiss="modal" aria-hidden="true">×</button>
    <div class="modal-content">
        <div class="modal-body">
            <img src="" alt="" />
        </div>
    </div>
</div>

}))

但是在我的方法中，像这样，链接在整个页面中被替换

 $('#full-size-image img').attr('src', function(i, src) {
        return src.replace('thumbs','originals');
    });

---

您是否尝试过这样定义：

var src = $('#full-size-image img').attr('src');
var new_src = src.replace('thumbs','originals');
$('#full-size-image img').attr('src',new_src);

谢谢，Wahyu Kodar

我的方法：

$(document).ready(function() {
var $lightbox = $('#lightbox');

$('[data-target="#lightbox"]').on('click', function(event) {

    var src = $('#small-size-image img').attr('src');
    var new_src = src.replace('thumbs','originals');
    $('#full-size-image img').attr('src',new_src);

    var $img = $(this).find('img'),
        alt = $img.attr('alt'),
        css = {
            'maxWidth': $(window).width() - 100,
            'maxHeight': $(window).height() - 100
        };

    $lightbox.find('.close').addClass('hidden');
    $lightbox.find('img').attr('src', new_src);
    $lightbox.find('img').attr('alt', alt);
    $lightbox.find('img').css(css);

    });

$lightbox.on('shown.bs.modal', function (e) {
    var $img = $lightbox.find('img');
    $lightbox.find('.modal-dialog').css({'width': $img.width()});
    $lightbox.find('.close').removeClass('hidden');
});
});

及

×

从#小尺寸图像获取src并打开。单击粘贴到#全尺寸图像新建"src

您还可以执行以下操作：

$('#full-size-image img').prop('src', function (i, src) {
  return src.replace('thumbs', 'original');
});

---

我被删除了灯箱的剪子，并给予

---

我有一些问题。如果在我的第1页图像中，该方法有效。但若我有两个或更多的图像，点击第二个图像，我会在lightbox中查看第一个图像。

<div id="lightbox" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog">
<button type="button" class="close hidden" data-dismiss="modal" aria-hidden="true">×</button>
<div class="modal-content">
    <div id="full-size-image" class="modal-body">
        <img src="" alt="" />
    </div>
</div>

$('#full-size-image img').prop('src', function (i, src) {
  return src.replace('thumbs', 'original');
});

a href= as original img
src = as thumb image