javascript - 如何确保使用jquery将所有内容加载到ajax中

大家好，我在使用jquery将某些内容加载到页面时被困住了。
代码是这样的：

$("#holder").fadeout();
$("#holder").load("test.html", callbackfn);

function callbackfn(){
    $("#holder").fadein();
}

test.html

<div style="background-image:url(1.jpg);">test</div>

这是主要思想，实际上它可以正常工作，只是在图片完全加载之前淡入#holder。
如何在显示#holder之前确保test.html中的所有内容都已完全加载？

最佳答案

如果您有很多图像，这将有些棘手。最好的猜测是，由于您没有提供test.html，因此。

$("#holder").load("test.html", cbLoaded);

function cbLoaded(){
  var onLoadCount = $("img","#holder").length;
  var count = 0;
  $("img","#holder").bind("load",function(){
    count++;
    if( count === onLoadCount ){
      //Everything loaded!
    }
  });
};

这将适用于> = 1张图片，如果您只有一张图片，则只需使用bind（“ load”）并忘记点票业务。

关于javascript - 如何确保使用jquery将所有内容加载到ajax中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/3939023/