如何确定html元素是否已满载?

时间:2011-08-16 12:18:40

标签: javascript html browser

我需要知道包含图像的特殊html元素何时已完全加载。

这个html元素的问题是它在按钮点击的DOM中被完全替换。 我该怎么办?(我不想为每个包含图像分配一个处理程序。)

1 个答案:

答案 0 :(得分:0)

非常难看,但正在工作

var soManyImgsInHere = 0;
var fooAttachEvent = function(whereAreTheImages_Container){
  var where = whereAreTheImages_Container; //shorthand
  var length = where.length;
  soManyImgsInHere = length;
  var imgs = where.getElementsByTagName('img');
  for(var i=0;i<length;i++){
    imgs[i].onload = function(){
      soManyImgsInHere--;
      if(soManyImgsInHere == 0){
        alert('all imgs fully loaded'); // do whatever you want here :) all images are now fully loaded
      }
  }
};

让我们假设您的图片位于ID为“fooImages”的div中

然后在这个div下面简单地使用这个函数:

<div id="fooImages">
  <img src="1.jpg" />
  <img src="2.jpg" />
  <img src="3.jpg" />
</div>
<script>fooAttachEvent(document.getElementById('fooImages'));</script>

希望这会有所帮助:)