Javascript 仅加载单击的图像

我的网站上有一个CSS lightbox图库，但是它同时加载了缩略图和大型图像

以下是我的各种文件的内容

HTML:

我添加了一个脚本（jQuery）：

$（“a.galimg”）。单击（函数（）{
$（“.lightbox”）。每个（函数（）{
$（this.find（“img”）.attr（“src”），$（this.find（“img”）.attr（“data src”）；
});
});

现在，只有在单击缩略图后，才会加载大文件

问题是它们都是一次加载的，我希望一次只加载单击的一个

有办法做到这一点吗

---

我知道每个函数都可以这样做，我还可以使用其他函数吗？

Attr设置一个属性，如果您尝试使用它，我会选择这样的函数。我不确定您试图将属性设置为什么，但以下是语法：

<script>
$("a.galimg").click(function() {
        $(this).attr("data-src", "your desired data attribute");
    })
});
</script>

$（“a.galimg”）。单击（函数（）{
$（this.attr（“datasrc”，“您想要的数据属性”）；
})
});

---

Attr设置一个属性，如果您试图使用它，我会使用类似的内容。我不确定您试图将属性设置为什么，但以下是语法：

<script>
$("a.galimg").click(function() {
        $(this).attr("data-src", "your desired data attribute");
    })
});
</script>

$（“a.galimg”）。单击（函数（）{
$（this.attr（“datasrc”，“您想要的数据属性”）；
})
});

---

我不知道你为什么要这样做（如果你在网站上发布链接会更容易），但我会尽力帮助你。 只是不要使用“每个”函数。因此，您的代码应该如下所示：

$("a.galimg").click(function() {
    var imgID = $(this).attr('href');
    $(imgID).attr("src", $(this).data('srcbig'));
});

对于HTML：

<div class=galerie>
    <a href="#img1" class="galimg" data-srcbig="/images/big-img-1.jpg"><img src=/images/thumbnail.jpg /></a><a href="#_" class=lightbox id="img1"><img src="" alt="remember about me"></a>
</div>

---

您甚至可以删除第二个“a href”和图像，然后动态创建它。这完全取决于你的lightbox库如何工作以及你需要什么。

我不知道你为什么想做这样的事情（如果你发布一个链接到你的网站会更容易），但我会尽力帮助你。 只是不要使用“每个”函数。因此，您的代码应该如下所示：

$("a.galimg").click(function() {
    var imgID = $(this).attr('href');
    $(imgID).attr("src", $(this).data('srcbig'));
});

对于HTML：

<div class=galerie>
    <a href="#img1" class="galimg" data-srcbig="/images/big-img-1.jpg"><img src=/images/thumbnail.jpg /></a><a href="#_" class=lightbox id="img1"><img src="" alt="remember about me"></a>
</div>

---

您甚至可以删除第二个“a href”和图像，然后动态创建它。这完全取决于lightbox库的工作方式和您需要什么。

首先，这里应该有类名称的引号

=>

。其他的也一样。它可能无法解决问题，但它只是正确的语法。你是对的。代码在一段时间前被缩小了，所以引号被删除了。很抱歉。首先，这里应该有类名称的引号。其他的也一样。它可能无法解决问题，但它只是正确的语法。你是对的。代码在一段时间前被缩小了，所以引号被删除了。很抱歉，这个脚本基本上把第二个img的“datasrc”改为“src”，并带有大图像。我现在将尝试实现您的代码。谢谢这是我的网站演示和图片：这是保存代码：$（.galimg”）.click（function（）{var t=$（This.attr（“href”）；$（t.find（“img”）.attr（“src”），$（t.find（“img”）.attr（“data src”）}；该脚本基本上将带有大图像的第二个img的“data src”更改为“src”。我现在将尝试实现您的代码。谢谢这是我的网站演示和图片：这是保存代码：$（.galimg”）.click（function（）{var t=$（This.attr（“href”）；$（t.find（“img”）.attr（“src”），$（t.find（“img”）.attr（“data src”）}；在点击parent.galimg之后，脚本基本上将子img的“data src”更改为“src”。在点击parent.galimg之后，脚本基本上将子img的“data src”更改为“src”。