2015-05-08 2 views
0

Я запускаю Chrome с --disable-web-security. Мне нужно динамически выбирать 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> 

Как я могу это сделать?

ответ

0

Я бы попытался в первую очередь обернуть все это js в window.onload, чтобы убедиться, что javascript стреляет в нужное время.

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

, если это не сработает, то дать IFrame идентификатор

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

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

это должно исправить это, проверьте консоль на наличие ошибок, я делал это раньше, и он работал, если и те, дон «т исправить его, то есть что-то еще за пределами этого кода происходит

уведомления я прикрепленное к плавающему фрейму, а не окно плавающего фрейма

+0

Я дам ему идти - спасибо! Один вопрос: ваш последний пример говорит 'iframeWindow.onload = function() {' - вы имели в виду 'ifr.onload = function() {'? (В противном случае переменная 'ifr', созданная с помощью' getElementById() ', полностью не используется ...) – Merc

+0

да, это была опечатка –

Смежные вопросы