Javascript 如何使用jquery循环函数以不同ID的多个元素为目标

目前，我有以下代码：

$(document).ready(function(){
    // #filtertab-00 replace this with your element id
    $('#filtertab-00 .box-content .es-nav .elastislide-next, #filtertab-00 .box-content     .es-nav .elastislide-prev').click(function() {
    // trigger lazy load
    $("#filtertab-00 img.lazy").each(function(i) {
        $(this).delay(150*i).fadeIn(1000, function() {
            var src = $(this).attr("data-original");
            $(this).attr('src',src);
        });
    });
});

}))

我想使用此函数以对象名称（id）为目标，如下所示：

filtertab-00
filtertab-10
filtertab-20
filtertab-30
filtertab-40
filtertab-50
filtertab-60
....
filtertab-90

有人知道如何使用循环函数使其工作吗

我只想要这个： 当我选择一个选项卡（名称从filtertab-00到filtertab-90不等）后单击pre或next按钮时，它将激活当前选定选项卡上图像的懒散加载。

欢迎任何意见

也许你可以用。然后，您可以使用jQuery选择以

filtertab-

开头的所有ID，如下所示：

$('div[id^="filtertab-"]').each( //magic goes here );

---

注意：这个方法很慢，因为它必须在DOM中搜索ID符合条件的元素，但是它完成了这个任务。我从来没有注意到明显的延迟。

这是通过filoxo描述的选择器魔法解决的，但由于您需要图像，这里有另一个版本涉及

find（）

，以获取实际图像

$('div[id^="filtertab-"]').find("img.lazy").each(function(i) {
  $(this).delay(150*i).fadeIn(1000, function() {
    var src = $(this).attr("data-original");
    $(this).attr('src',src);
  });
});

---

除此之外，请查看。它们涵盖了很多方面：）

您能给它们提供一个通用的CSS类作为选择器吗？那会更容易。“这行得通吗？”-嗯，要回答这个问题，我必须运行它。考虑到你可以很容易地做到这一点，你不需要问我们是否有什么效果。你可以运行它，告诉我们为什么它不工作（错误消息，不正确的结果，等等），或者如果它工作，那么甚至不需要问问题…它有通用的css类，但该类也被其他人使用。它不是独立的。如何使它工作？好的，谢谢Chris。我将在几分钟后回来。对不起，这里有一对多的结束括号。它现在应该可以工作了。您好，是的，console报告没有问题，但lazyload现在遇到了问题。它不会在carousel（homefilter）的第一个选项卡上正常显示产品，我现在真的没有什么要做的：（代码用于在单击“”后激活lazyload，从这个意义上看，它似乎不起作用。但如果我这样做，我会单击“>”，在选择选项卡时单击pre或next按钮（名称从filtertab-00到filtertab-90不等），它将在当前选定的选项卡上激活图像的lazyloading。您能帮助我吗？我已更新了信息。谢谢。我将尝试查看您的jsBuying网站上的源代码，但我在实际识别问题时遇到了一些困难。如果我发现任何有用的内容，我将进行更新。@user3571443从我所看到的情况来看，问题是图像是当您使用<或>箭头时，e已加载，因为延迟加载取决于滚动高度。您需要找到一种方法，从图像中删除.Lazy类，直到它们在浏览器中可见为止，这完全是另一个问题。或者，我猜您是为旋转木马购买的，因此可以改为修改该脚本而是创建fadeIn效果。