Как изменить размер фрейма с динамическим контентом? - PullRequest
Новая
       4

Как изменить размер фрейма с динамическим контентом?

0 голосов
/ 03 января 2011

Я заполняю iframe некоторым содержимым, которое вводится в него, но я не могу правильно определить его размер. Я пробовал различные методы, но вот последний код.

После заполнения iframe почтовым сообщением на основе html, похоже, не регистрируется высота прокрутки. 

    <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>

Ответы [ 2 ]

0 голосов
/ 04 января 2011

Добавление другого ответа, потому что это проще ...

Оформление заказа: 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>

** В "Привет кадр"я просто но кучу ненужного текста, чтобы заставить его изменить размер ...

Единственным недостатком является то, что максимальная высота задается канвой ... но это можно решить, изменив высоту "холста" ...

0 голосов
/ 03 января 2011

Не знаю, где у вас проблемы ...

Вы должны просто быть в состоянии быстро определить его размер

*** Обновлено

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

*** Вы, вероятно, столкнулись с проблемой безопасности: Установить для iframe высоту содержимого для удаленного содержимого

Для контента из того же домена / local -it будет работать ... (проверено) .. если вы попытаетесь загрузить удаленную страницу, это не будет работать ...

Это работает 

<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>
...