jquery从php脚本预加载图像然后显示答案

【问题标题】：jquery pre-load image from php script then displayjquery从php脚本预加载图像然后显示
【发布时间】：2012-04-23 07:17:37
【问题描述】：

我已经四处寻找这个案例并接近了，但我在完成它时遇到了问题。

我有一个创建图表的 PHP 脚本。它通过创建一个 png img 然后使用标题将图像显示到页面来实现。

我可以这样做：

$('#img').attr('src', 'url.php?make_graph=1');

这很有效。问题是，我有一些图表需要很长时间才能创建，超过一分钟，而此时图像只是空白，网页看起来什么也没做。

我找到了一种预加载图像的方法，但没有找到将其应用到网页的方法（实际上来自堆栈溢出）。我能做到：

$('<img/>', {
    'src': 'url.php....',
    'load': function(){ alert("loaded!"); }
});

所以我的问题是，我可以以这样的方式加载图像并以某种方式将其应用于页面上的现有图像吗？我不确定那句话是否很清楚......我错过了我可以实际显示由脚本制作的预加载图像的部分。如果可能，我想避免保存图像或使用 iframe。

坦克寻求帮助。

【问题讨论】：

【解决方案1】：

加载后，将图像 src 设置到您在后台加载的相同位置，它将（理论上）从缓存中拉出并显示给用户。

$("<img>", {
    "src": "url.php...",
    "load": function() {
        alert("loaded!");
        $("#foo").attr("src", "url.php...");
    }
});

这是我整理的一个例子。它最初在页面上加载一张图片，然后在后台加载另一张图片。当您确认警报消息时，它将通过更改 src 来交换图像。我确认它使用 Chrome 开发工具从缓存中提取图像。 http://jsfiddle.net/uVFLD/1/

可能有另一种方法可以解决这个问题，但这是我想到的第一个解决方案。

【讨论】：