我必须在页面中加载PDF。
理想情况下,我希望有一个加载的动画gif,一旦加载了PDF,它就会被替换。
我必须在页面中加载PDF。
理想情况下,我希望有一个加载的动画gif,一旦加载了PDF,它就会被替换。
Answers:
你有没有尝试过:
$("#iFrameId").on("load", function () {
    // do something once the iframe is loaded
});
              $(function({})以便首先加载框架。但是没有得到希望的结果。Chrome 25 Mac
                    这对我有用(不是pdf,而是另一种“可onload抵抗”的内容):
<iframe id="frameid" src="page.aspx"></iframe>
<script language="javascript">
    iframe = document.getElementById("frameid");
    WaitForIFrame();
    function WaitForIFrame() {
        if (iframe.readyState != "complete") {
            setTimeout("WaitForIFrame();", 200);
        } else {
            done();
        }
    }
    function done() {
        //some code after iframe has been loaded
    }
</script>  
希望这可以帮助。
setTimeout(WaitForIFrame, 200);
                    我正在尝试这样做,似乎正在为我工作:http : //jsfiddle.net/aamir/BXe8C/
更大的pdf文件:http: //jsfiddle.net/aamir/BXe8C/1/
Loading PDF...但一直保留,但是在我刷新页面时说PDF Loaded!。但这似乎适用于url :),所以对我来说非常有用。谢谢!
                    $("#iFrameId").ready(function (){
    // do something once the iframe is loaded
});
您是否尝试过.ready?
我尝试了一种开箱即用的方法,我没有针对PDF内容对此进行测试,但它确实适用于基于HTML的普通内容,方法如下:
步骤1:将Iframe包裹在div包装器中
步骤2:将背景图片添加到div包装器中:
.wrapperdiv{
  background-image:url(img/loading.gif);
  background-repeat:no-repeat;
  background-position:center center; /*Can place your loader where ever you like */
}
第3步:在您的iframe代码中添加  ALLOWTRANSPARENCY="false" 
想法是在包装器div中显示加载动画,直到iframe加载后iframe将覆盖加载动画为止。
试试看。
@Alex aw真是可惜。如果您iframe的HTML文档如下所示,该怎么办:
<html>
  <head>
    <meta http-equiv="refresh" content="0;url=/pdfs/somepdf.pdf" />
  </head>
  <body>
  </body>
</html>
绝对可以,但是它可能适用于Firefox。尽管我想知道在这种情况下load事件是否会过早触发。
在iFrame中的pdf正在加载时,我不得不显示一个加载器,所以我想到了:
    loader({href:'loader.gif', onComplete: function(){
            $('#pd').html('<iframe onLoad="loader.close();" src="pdf" width="720px" height="600px" >Please wait... your report is loading..</iframe>');
    }
    });
我正在展示装载机。一旦确定客户可以看到我的加载程序,就可以调用加载iframe的onCompllet加载程序方法。iframe有一个“ onLoad”事件。一旦加载了PDF,它会触发onloat事件,其中我隐藏了加载器:)
重要部分:
iFrame具有“ onLoad”事件,您可以在其中执行所需的操作(隐藏加载程序等)
这是我所做的任何操作,它可以在Firefox,IE,Opera和Safari中运行。
<script type="text/javascript">
  $(document).ready(function(){
    doMethod();
  });
  function actionIframe(iframe)
  {
    ... do what ever ...
  }
  function doMethod()
  {   
    var iFrames = document.getElementsByTagName('iframe');
    // what ever action you want.
    function iAction()
    {
      // Iterate through all iframes in the page.
      for (var i = 0, j = iFrames.length; i < j; i++)
      {
        actionIframe(iFrames[i]);
      }
    }
    // Check if browser is Safari or Opera.
    if ($.browser.safari || $.browser.opera)
    {
      // Start timer when loaded.
      $('iframe').load(function()
      {
        setTimeout(iAction, 0);
      }
      );
      // Safari and Opera need something to force a load.
      for (var i = 0, j = iFrames.length; i < j; i++)
      {
         var iSource = iFrames[i].src;
         iFrames[i].src = '';
         iFrames[i].src = iSource;
      }
    }
    else
    {
      // For other good browsers.
      $('iframe').load(function()
      {
        actionIframe(this);
      }
      );
    }
  }
</script>
              由于加载pdf文件后,iframe文档将具有一个新的DOM元素<embed/>,因此我们可以像这样进行检查:
    window.onload = function () {
    //creating an iframe element
    var ifr = document.createElement('iframe');
    document.body.appendChild(ifr);
    // making the iframe fill the viewport
    ifr.width  = '100%';
    ifr.height = window.innerHeight;
    // continuously checking to see if the pdf file has been loaded
     self.interval = setInterval(function () {
        if (ifr && ifr.contentDocument && ifr.contentDocument.readyState === 'complete' && ifr.contentDocument.embeds && ifr.contentDocument.embeds.length > 0) {
            clearInterval(self.interval);
            console.log("loaded");
            //You can do print here: ifr.contentWindow.print();
        }
    }, 100); 
    ifr.src = src;
}