在通过javascript调用的内容正在加载时，如何显示加载gif图像? [英] How to show loading gif image while content called via javascript is loading?
问题描述
在我的页面上，我有JavaScript可以从位于inc/content.php的其他页面加载<div id="content"></div>中的新内容.我想知道如何在新内容加载到其中时在<div id="content"></div>中显示动画gif图像loading.gif?并加载后隐藏gif并显示新内容?
On my page I have javascript that loads new content in <div id="content"></div> from other page located at: inc/content.php. I would like to know how can I show animated gif image loading.gif in <div id="content"></div> while new content gets loaded into it? and once loaded hide gif and show new conntent?
谢谢你))) 这是我的代码:
Thank You ))) Here is my code:
<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>
inc/content.php页面中的内容:
<div id="text">Hello</div>
推荐答案
function viewNext(){
$('#content').html('<img src="loading.gif" />').load("inc/content.php");
}
使用load()时，它将替换元素中的所有内容，包括gif，因此您不必手动隐藏它.
When you use load() it will replace anything in the element, including the gif so you dont have to manually hide it.
这篇关于在通过javascript调用的内容正在加载时，如何显示加载gif图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
