Question

我使用以下代码：

   $.ajax({
        url: "pgiproxy.php",
        data: ({ data : $("#formdata").serialize(), mode : "graph"}),
        success: 
            function(result){
                var temp = $('<div/>').html(result);
                var val = temp.find('center').html();
                $('#BFX').html(val);
            },
        error:
            function(){
                $("#error").html("ERROR !!!");
            }
    });

来自ajax调用'pgiproxy.php'的'result'是一个完整的网页（以字符串形式返回），然后将其转换为jQuery对象并存储在'var'中。然后我使用存储在'val'中的.find（）提取我需要的数据（.gif图像）。然后将该图像插入#BFX div中进行显示。

我的问题是每次连续点击我的按钮来更新此图像，它会显示图像从上到下加载，因为它是从网上读取的。是否有一种方法只有在完全加载后才显示此图像，因此用户不会看到图像加载，只能立即看到图像。

Answer 1

在<img>

上使用.load()加载事件

首先隐藏图像，然后在加载完成后显示...

quick demo查看代码

Answer 2

您可以手动完成所有操作：在后台加载图片，然后将其插入页面。有几篇文章详细讨论了主题，包括这一篇： http://jqueryfordesigners.com/image-loading/

使用jquery + ajax延迟显示加载的图像

2 个答案: