onready / onload for document.innerHTML更改

Question

我正在使用iCanHaz.js来交换屏幕，但是一旦新内容完全加载完毕，我需要一个函数来触发。之前我已经能够通过使用0的setTimeout来使调用异步，但在具有大量图像的页面上，这似乎不会很快就会发生。

function show_page(){
   document.getElementById('container').innerHTML = ich.artworks({
      variables : variables
   });
   window.setTimeout(function(){
       var midWidth = (document.body.offsetWidth/2) - window.innerWidth / 2;
      var midHeight = (document.body.offsetHeight/2) - window.innerHeight / 2;
      scrollTo( midWidth, midHeight);
   }, 0);
}

如何在知道高度之前延迟此功能？即使我知道高度，我也无法滚动到低于当前页面高度的点，所以我必须等到图像加载后如果我不知道它们的高度。

Answer 1

您必须稍微修改基于模板的方法，但如果使用new Image()创建图像，则可以使用onload事件来确定所有图像的加载时间，然后设置尺寸。

Answer 2

有一个类似的案例：

How can I tell when changes to jquery html() have finished?

建议的解决方案是在HTML渲染之后为要执行的代码添加1（不为0）的超时，因为超时代码在JavaScript底层线程完成渲染之后执行。

希望适合您的情况。