Question

我有以下代码，我正在尝试使加载器出现，然后图像在加载后淡入。我想让函数可重用，所以我可以使用加载器ID将图像添加到div中，它将起作用。

我无法弄清楚如何从图像中选择父装载程序div。注释行工作正常，但我认为这将选择所有div。我只想选择父装载程序div。任何人都可以帮忙，谢谢。

<div id="loader" class="loading">
  <img src="http://www.inhousedesign.co.nz/images10/caravan_01.jpg" style="display: none;"/>
</div>  

$("#loader").each(function(){
    var source = $(this).find("img").attr('src');
    var img = new Image();

    $(img).load(function(){
      $(this).hide();
      //$("#loader").removeClass('loading').append(this);
      $(this).parents("div:first").removeClass('loading').append(this);
      $(this).fadeIn(800);
    }).attr('src', source);    
  });

Answer 1

为什么不使用parent方法？

 $(this).parent().removeClass('loading').append(this);

Answer 2

最简单的方法是让div的背景有loading.gif ...

#div {
   background:url(loading.gif) no-repeat center center;
}

然后在加载时让img淡入。

Answer 3

正如德里克所说。 #loader选择带有id加载器的div，只应该有一个

如果你想为许多人制作泛型，请给div一个类并使用父选择器

例如

$(this).parent().removeClass('loader')

jquery从图像内部选择此父级

3 个答案: