加载外部页面时Gif没有运行

时间:2013-09-18 13:51:47

标签: javascript php html ajax jquery

我有一个庞大的php表,我希望通过AJAX加载它以向用户插入一个加载的gif。 所以我非常喜欢这种操作,我做了一个非常简单的代码来完成这项任务。 这是我的代码:

$(document).ready(function() {
                $("#tableDiv").html('<center><img src="images/loader.gif" /></center>');
                $("#tableDiv").load("regulatoryData.php");
            }); 

这是加载gif但它没有运行,它仍然是静态的。 我怎么能纠正它? 有什么建议吗?

编辑:当我将图片拖到浏览器时,它会正常动画。

编辑2:只是

$("#tableDiv").html('<center><img src="images/loader.gif" /></center>');

gif工作正常,但是当我添加第二部分时,它开始运行,就在它停止并保持冻结状态,直到监管数据出现

编辑3:其实我检查过这不是冻结的gif,而是整个浏览器。

抱歉我的英文:/

3 个答案:

答案 0 :(得分:0)

我会推荐以下内容:

http://jsfiddle.net/NeFaz/1/

<a href="#" id="load">Load</a>
<div id="myid">
</div>

$(document).ready(function() {
    $("#load").click(function() {
        $('#myid').addClass('loading');
        $("#myid").load('http://www.confetti.co.uk/shop/', function () {
            $('#myid').removeClass('loading');
        });
    });
}); 

#myid {
    height: 500px;
    width: 500px;
}
#myid.loading {
    background-image: url('http://koikoikoi.com/wp-content/uploads/2012/07/RESET.gif');
}

这将图像设置为div的背景,但仅在应用类时。我们从没有这门课开始。

点击加载链接后,我们将加载类添加到div中,并显示bg图像。负载上使用的函数在加载完成时触发,并从div中删除类,因此删除图像。

答案 1 :(得分:0)

<BODY>

的开头添加
<img src="images/loader.gif" style="display:none" />

作为&#34;预装载者&#34;

答案 2 :(得分:0)

我发现当你开始加载另一个页面时,IE会停止动画GIF。我已经在我自己的一个项目中通过添加一个超时来解决这个问题,该超时在另一个页面开始加载后50毫秒刷新图像源,只需再次分配相同的值。在你的情况下,看起来像这样:

$(document).ready(function() {
            $("#tableDiv").html('<center><img src="images/loader.gif" /></center>');
            setTimeout(function() { $("#tableDiv img").attr("src", "images/loader.gif"); }, 50);
            $("#tableDiv").load("regulatoryData.php");
        });