HTML网页显示图片的效果

Question

最近正在用JFreeChart为一个商业舆情挖掘系统生成图表，以JPEG格式放在HTML网页中，JFreeChart生成图表过程虽然很快，但是整个过程比较慢，因为要做很复杂的数据库查询。在HTML网页上的同一个位置要显示三种图，用一个tab菜单控制显示哪一个，点击tab菜单时，用一段javascript代码设定img的src特性，即 oImg.setAttribute("src", "某图的URL"); 实现图的切换。点击tab菜单后，图的生成过程有个比较长的延迟，我希望此时在网页的图片位置显示一个标志性的图或文字，例如，一个动画旋转的圆圈，表示正在计算中。一旦图表下载下来了，就用实际的图代替该标志。怎样实现？

Answer 1

请教楼上各位：我用oImg.setAttribute("src", "xxxURL"); 加载目标图片，这个函数立即返回了，实际图片还在加载中，用什么函数或者事件知道图片加载完了？

Answer 2

<img src="servlet" onload="图片加载中"/>

Answer 3

<script>
//图像加载完后切换显示
function showMe()
{
  document.getElementById("loading").style.display="none";
  document.getElementById("loaded").style.display="block";
}
</script><img id="loading" src="表示等待的动画图片" />
<img id="loaded" src="JSP返回的图片" onload="showMe()" stype="display:none" />

Answer 4

似乎和我碰到的很像。
我说说我做的吧。不过可能情况不太一样吧。我那个没什么计算， 就是图片很大。于是我做了个这个：
1 先换成一个转动的gif。
2 进行一次ajax请求， 请求那个图片。 请求完了就不要了。
3 ajax请求结束了， 就把图片路径换下来。 因为ajax请求过了， 所以缓存里有了， 因此图片可以立刻被加载。实际效果还不错。