等待，直到由.html（）加载的内容准备好

我有一个页面，我使用jquery .get()方法加载内容和.html()将它们显示在我的页面上。在加载过程中，我有一个带有位于页面上方的预加载器的div盒，以隐藏弹出的新元素，而是显示一个gif。虽然有些页面需要很长时间才能加载，因为其中包含iframe，图片等。现在我只希望preloader div在所有内容完全加载后都被删除，这是我无法找到答案的地方，因为没有.html()回调函数。我试过,.on()负载作为事件，.done()功能在.get()方法，但似乎没有任何工作，因为我想要它。等待，直到由.html（）加载的内容准备好

当我的ajax div的内容加载完成时，有没有什么机会可以找到，所以我可以删除preloader？

编辑
这是我的HTML标记

<div class="wrapper"> 
<div class="ajax_cont"> 
<!-- The content will come in here --> 
</div> 
<div class="preloader"></div> 
</div>

也许我没有解释的问题不够清晰，所以这里是我的js代码，以及：

function load_ajax(linktofile) { 
    $(".preloader").fadeIn(200); 

    setTimeout(function() { 
     $.get("ajax/" + linktofile, function(data){}).done(function(data) { 

      var content = $(data).filter('#loaded_content').html(); 

      $(".ajax_cont").html(content); //It takes a while until all pictures, which were included in content, are fully loaded in .ajax_contnt   

      setTimeout(function() { 
       $(".preloader").fadeOut(200); //I want this to be executed only when everything is fully ready 
      }, 150); 

     }); 
    }, 200);  
}

我我添加了一些评论来澄清，我的意思是什么。

来源

2015-06-07 LL1997

'.done（）'不会火，直到你的Ajax完成后。 – sharf

可以在问题中包含'html'？ – guest271314

将预加载器放入要替换的html中，因此在完成时，ajax调用将替换预加载器 –

-1

试试这个

jQuery(document).ready(function($){ 
    // assuming .loader is a button/link to load content 
    // and .preloader is the window (overlay) that will show while content is being loaded 
    $('.loader').click(function(){ 

    // fadein 
    $('.preloader').fadeIn(200); 

    // load content 
    $('.ajax_cont').load("ajax/" + linktofile,function(){ 

     // use jquery's **:last** to wait for the last image to load then fadeout 
     $('.ajax_cont img:last').on('load',function(){ 
      $('.preloader').fadeOut(200); 
     }); 

    }); // ajax_cont load 
    }); // loader click 
}); // document ready

来源

2015-06-07 15:45:55

不幸的是，这不起作用！ – LL1997

等待，直到由.html（）加载的内容准备好

回答

相关问题