加载另一个div时隐藏div

Question

我有这个：

window.onload = function() {
    $("#show").load("show.php");
}

和我的HTML：

<div id='loader'>Loading Data</div>
<div id='show'></div>
<div id='other'>some text.........</div>

我想要的是，在页面加载时，html show <div id='loader'>和<div id='other'>当JS / JQuery成功加载<div id='show'>然后隐藏<div id='loader'>

你能帮助我吗？

Answer 1

.load()提供callback即可使用此功能。刚刚用以下

更新你的js

$("#show").load("show.php", function(){
   $('#loader, #show').toggle(); 
});

Answer 2

load（）有一个在完成后运行的回调。使用此选项可显示和隐藏相关的div。您还应该使用jQuery ready函数而不是window.onload，以便页面在加载到php之前不必等待所有资源（图像等）：

$(document).ready(function() {
    $("#show").load("show.php", function() {
        $('#loader').hide();
    });
});

编辑：超级用户的回答提供了比使用.hide（）更好的解决方案，希望我能想到它！

Answer 3

作为@techLove的评论here，我发现这对我有用。我修改了他的答案：
 $( "#show" ).load( "show.php", function() {$("#loader").css("display","none");});