更改图像 src 不起作用 jquery/js

Question

我正在我的网站上建立我自己的照片库，直到现在我也一直使用完整的图像作为缩略图，但你知道这不是很有效。

我试图在单击父项时更改图像的 src <li> 但没有任何反应。我究竟做错了什么？

这是我得到的代码：

$('.bild').click(function() {
                            $(this).toggleClass('bild').toggleClass('aktiv').addClass('bounceIn');
                            $('#letterboxFader').toggleClass('letterboxFader-active').toggleClass('letterboxFader-inactive');
                            $('.bild img').attr('src',$(this).attr('src').replace('thumb','large'));
                        });

                        $('.aktiv').click(function() {
                            $(this).toggleClass('aktiv').toggleClass('bild').removeClass('bounceIn');
                            $('#letterboxFader').toggleClass('letterboxFader-inactive').toggleClass('letterboxFader-active');
                            $('.bild img').attr('src',$(this).attr('src').replace('large','thumb'));
                        });

请注意，我只为名为 "Coast Warning" 的图片设置了缩略图以供测试。

Answer 1

您的代码期望 <li> 将具有 "src" 属性，但它不会。更新图片来源：

$(this).find("img").each(function() {
  this.src = this.src.replace("thumb", "large");
});

"click" 处理程序位于 <li> 元素上，因此您要做的第一件事就是找到单击 <li> 中的 <img>。表达式 $("img") 以页面上的每个 <img> 元素为目标，我认为这不是您想要做的。如果你这样做，那么代码应该是：

$("img").each(function() {
  this.src = this.src.replace("thumb", "large");
});

更改图像 src 不起作用 jquery/js

Change image src doesn't work jquery/js

javascript

jquery

image

gallery

src