缩略图在 Jquery 中不显示正确的图像答案

【问题标题】：Thumbnails dont show the correct image in Jquery缩略图在 Jquery 中不显示正确的图像
【发布时间】：2013-03-31 14:22:46
【问题描述】：

我在为网站创建照片库时遇到问题。图库的每个缩略图都显示第一个缩略图的图像。我使用的代码：

    $(".thumb").click(function() {
    $(".image").fadeOut(500, function() {
        $(".image").attr("src",$(".thumb").attr("href"));
    }).fadeIn(500);
    return false;
});

【问题讨论】：

标签： jquery image gallery thumbnails

【解决方案1】：

您正在 javascript 中选择第一张图片和缩略图。使用$(this) 作为被选元素的引用，像这样...

$(".thumb").click(function() {
    var $thumb = $(this);
    $(".image").fadeOut(500, function() {
        $(this).attr("src",$thumb.attr("href"));
    }).fadeIn(500);
    return false;
});

$thumb是被点击的元素，而在fadeOut回调中$(this)是被选中的图片元素。我怀疑只有 1 个类 image，但这是使用 $(this) 的另一个示例。

【讨论】：

【解决方案2】：

因为您使用的是$(".thumb").attr("href")，它将返回匹配该选择器的第一个元素的值。

【讨论】：