Question

我正在使用--disable-web-security启用Chrome。我需要动态选择一个URL，在加载时显示帧内容，并确切知道帧何时加载完毕。

我很想知道框架本身何时加载，和当每个CSS等已加载时。

测试页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html style="height: 100%" xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8" />
      <meta http-equiv="Cache-Control" content="no-cache" />
      <meta http-equiv="Pragma" content="no-cache" />
      <title>The title</title>
   </head>

   <script type="text/javascript">
   document.addEventListener("DOMContentLoaded", function(event) {
    console.log("MAIN content loaded!");

    // Get iframe and iframe's window
    var iframe = window.frames[ 0 ];
    var iframeWindow = iframe.window;
    var iframeDocument = iframe.window.document;

    // Doesn't work
    iframe.addEventListener('load', function( e ) {
      console.log("IFRAME loaded!");
    });

    // Doesn't work
    iframeDocument.addEventListener('load', function( e ) {
      console.log("IFRAME loaded!");
    });

    // Doesn't work
    iframeWindow.addEventListener('load', function( e ) {
      console.log("IFRAME loaded!");
    });

    iframeWindow.onload = function(){
      console.log("IFRAME loaded!");
    };

    iframeWindow.location = "http://www.google.com";
  });

   </script>

   <!-- NOTE: Eventually, changing "url" will change the iframe source -->

   <body style="height:90%;">

     <p>App</p>
     <form>
       <input name="url" type="text" size="20%" value="http://">
     </form>

     <div id="frame" style="height:100%">
       <iframe style="width: 100%; height:100%;" src="">
     </div>
   </body>
</html>

我该怎么做？

Answer 1

我首先尝试在window.onload中包装所有这些js，以确保javascript在正确的时间触发。

window.onload=function(){
    // confirm that iframeWindow is correctly pointing to element
    iframeWindow.onload=function(){
        console.log('laoded')
    };
};

如果不起作用，请给iframe一个id

<iframe id="myiFrame" style="width: 100%; height:100%;" src="">

window.onload=function(){
    var ifr=document.getElementById('myiFrame');
    iframeWindow.onload=function(){
        console.log('laoded')
    };
};

这应该修复它，检查控制台是否有错误，我之前已经完成了它并且它有效，如果两者都没有修复它，那么此代码之外还有其它东西

注意我附加到iFrame，而不是iFrame的窗口

框架在chrome中加载时的火灾事件

1 个答案: