如何显示加载gif图像，而通过javascript调用的内容正在加载？

在我的页面上我有javascript，它从位于inc/content.php的其他页面加载<div id="content"></div>中的新内容。我想知道如何在<div id="content"></div>中显示动画gif图像loading.gif，同时将新内容加载到它中？一旦加载隐藏gif并显示新的内容？如何显示加载gif图像，而通过javascript调用的内容正在加载？

谢谢）））这里是我的代码：在INC/content.php页

<html> 
<head> 

<script type="text/javascript" src="js/jquery-1.6.4.js"></script> 
<script type="text/javascript"> 
function viewNext() 
{ 
$("#content").load("inc/content.php"); 
} 
</script> 

</head> 
<body> 

<button id="nextfLuky" onClick="viewNext();return false;">Next fLuky</button> 

<div id="content"></div> 

</body> 
</html>

内容：

<div id="text">Hello</div>

来源

2011-10-14 Ilja

function viewNext(){ 
    $('#content').html('<img src="loading.gif" />').load("inc/content.php"); 
}

当您使用负载（），它会在元素替代任何东西，包括GIF，所以你不要有手动隐藏它。

来源

2011-10-14 15:37:10 472084

它显示gif图像一段时间，然后消失，但没有显示内容。 – Ilja

omg，sory文本的颜色是白色这就是为什么我没有看到它））） – Ilja

function viewNext() 
    { 
    $('#content').html('<img src="/images/loading.gif" />'); 
    $("#content").load("inc/content.php"); 
}

这将做到这一点。

来源

2011-10-14 15:28:07

我会尝试它）））以防万一，我假设之前，我将不得不设置显示没有和负载设置显示来阻止

或者是不必要的，我错了吗？ – Ilja

$('#content').append('<img id="delete_me_spinner2" src="/images/ajax-loader.gif" border="0" style="text-decoration: none" alt="Loading" />'); 
    var y = $.post(.....) 
       .complete(function(data) { 
       $('#delete_me_spinner2').remove(); 
    //check ajax went ok 
     });

来源

2011-10-14 15:32:28 max4ever

var y = $ .post（.....）我会在这里包含inc/content.php文件的路径吗？ – Ilja

$ .load是一个使用$ .get，$ .get类似于$ .post，并且$ .post和$ .get都是$ .ajax的包装的东西的包装器。检查http：//api.jquery .com/load /有关详细信息，我只想指定在请求之前添加图像，然后在删除之后将其删除 – max4ever

如何显示加载gif图像，而通过javascript调用的内容正在加载？

回答

相关问题