如何檢測iframe何時開始加載以及何時加載完成

Question

我正在使用iframe上傳文件的項目上工作。

當iframe開始上傳文件並在iframe完成加載時隱藏預加載程序時，需要顯示預加載程序。

有人可以幫我嗎？

Answer 1

我找到了解決辦法：

這是iframe的父文件：

<div id="loader"></div> 
<div class="iframeClass"> 
    <iframe src="myIframe.php" id="myIframe" frameborder="0"></iframe> 
</div> 
<script type="text/javascript"> 
    document.getElementById('myIframe').onload = function() { 
     document.getElementById('loader').style.display = 'none'; 
    } 
</script> 

這是iframe的文檔：

<form action="myIframe.php" method="post" enctype="multipart/form-data" id="myForm"> 
<input type="file" name="myFile" id="myFile" /> 
</form> 
<script type="text/javascript"> 
    document.getElementById('myFile').onchange = function() { 
     top.document.getElementById('loader').style.display = 'block'; 
     document.getElementById('myForm').submit(); 
    } 
</script> 

享受guys :)））

Answer 2

你可以試試下面的jQuery代碼：

$(document).ready(function(){ 
alert("Iframe Start Loading ..."); 
     var ifr=$('<iframe></iframe>', { 
      id:'frame', 
      src:'http://ernagroup.com', 
      style:'display:none', 
      load:function(){ 
       $(this).show(); 
       alert('iframe loaded !'); 
      } 
     }); 
     $('body').append(ifr); 
});