Question

目前，我有这段代码：

$(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不等），它将激活当前所选标签上图像的延迟加载。

欢迎任何想法！

Answer 1

也许您可以使用jQuery's attribute-starts-with selector。然后，您可以使用jQuery选择以filtertab-开头的所有ID，如下所示：

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

注意：此方法很慢，因为它必须在DOM中搜索ID符合条件的元素，但它可以完成工作。我从来没有注意到明显的延迟。

Answer 2

这是通过选择器魔术解决的，因为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);
  });
});

除此之外，请查看the impressive list of jQuery selectors。它们涉及很多方面：）

如何使用jquery循环函数来定位具有不同id的多个元素

2 个答案: