0

我正在填充一个 iframe,其中包含一些注入其中的内容,但我无法正确调整它的大小。我尝试了多种方法,但这是最新的代码。

在使用基于 html 的邮件消息填充 iframe 后,它似乎没有注册滚动高度。

    <iframe scrolling="no" width="100%" onload="javascript:(LoadIFrame(this));" >
HTML content goes here.  Make sure it's long enough to need to scroll before testing.
</iframe>

<script type="text/javascript">
    function LoadIFrame(iframe) {
        $("iframe").each(function() {
            $(this).load(function() {
                var doc = this.document;
                if (this.contentDocument) {
                    doc = this.contentDocument;
                } else if (this.contentWindow) {
                    doc = this.contentWindow.document;
                } else if (this.document) {
                    doc = this.document;
                }
                this.height = (doc.body.scrollHeight + 50) + 'px';
                this.onload = '';
            });

            txt = $(this).text();
            var doc = this.document;
            if (this.contentDocument) {
                doc = this.contentDocument;
            } else if (this.contentWindow) {
                doc = this.contentWindow.document;
            } else if (this.document) {
                doc = this.document;
            }
            doc.open();
            doc.writeln(txt);
            doc.close();
        });
    }
</script>
4

2 回答 2

0

不知道你哪里有问题...

你应该能够快速调整它的大小

*** 更新

theframe.height = document.frames['sizedframe'].document.body.scrollHeight + 'px'; }

*** 您可能遇到了安全问题: 将 iframe 设置为远程内容的内容高度

对于来自同一域/本地的内容 - 它可以工作...(已验证).. 如果您尝试加载远程页面,它将无法工作...

这个作品

<iframe id="sizedframe" style="width:100%" onload="sizeframe(this);" src="demo.htm"></iframe>

这不会(除非它是从 stackoverflow 上的页面调用的)

<iframe id="sizedframe" style="width:100%" onload="sizeframe(this);" src="http://www.stackoverflow.com"></iframe>
于 2011-01-03T17:17:36.343 回答
-1

添加另一个答案,因为它更容易......

结帐:http : //thomas.bindzus.me/2007/12/24/adding-dynamic-contents-to-iframes/ 我刚刚从帖子末尾抓住了他的 IFrame.js 来创建动态框架......

所以试试他的例子,看看它不这样做..

然后换掉这个HTML...

<html>
   <head>
      <title>Adding Dynamic Contents to IFrames</title>

      <script type="text/javascript" src="IFrame.js"></script>
      <script type="text/javascript">
         function onPageLoad()
         {
            var canvas = document.getElementById("canvas");
            var iframe = new IFrame(canvas);

            var div = iframe.doc.createElement("div");
            div.innerHTML = "Hello IFrame!";
            iframe.doc.body.appendChild(div);

            frameheight = iframe.document.body.scrollHeight;
            iframe.width = '100%';
            iframe.height = frameheight + 'px';
         }


      </script>
   </head>

   <body onload="onPageLoad();">
      <div id="canvas" style="border: solid 1px #000000; height: 500px; width: 500px;"></div>
   </body>
</html>

** 在“你好框架”中,我只是一堆垃圾文本,导致它调整大小......

唯一的缺点是最大高度由画布设置......但这可以通过调整“画布”高度来解决......

于 2011-01-04T16:53:57.773 回答