代码之家  ›  专栏  ›  技术社区  ›  Dean J

iframe.document.body.scrollheight是正确值的两倍

  •  3
  • Dean J  · 技术社区  · 14 年前

    <iframe name="asdf" id="asdf" onload="change_height(this)" src="asdf.jsp" width="250" scrolling="no" frameborder="0"></iframe>

            function change_height(iframe) {
                if (document.all) {
                    // IE.
                    ieheight = iframe.document.body.scrollHeight;
                    iframe.style.height = ieheight;
                } else {
                    // Firefox.
                    ffheight= iframe.contentDocument.body.offsetHeight;
                    iframe.style.height = ffheight+ 'px';
    
                }
            }
    

    ieheight是在ie7中运行时实际高度的两倍;尚未在ie6上进行测试。如果我使用 滚动高度 驾驶执照 .

    这是火狐的正确高度。

    在我通过除以ie值/2来修补它之前,正确的方法是什么?

    2 回复  |  直到 11 年前
        1
  •  8
  •   bobince    14 年前

    document.body 表示IE在Quirks模式下运行时的视区。如果iframe中的文档有点奇怪,则 scrollHeight body 将等于其视区的高度,即iframe的默认高度。

    如果您真的需要在Quirks模式下获取文档高度,那么您必须添加一个额外的wrapperDiv来度量。更好的解决方法是确保所有文档都使用标准模式doctype。在这十年里,你不应该用怪癖模式创作任何东西。

    另外,你不应该使用 document.all 对于IE嗅探(其他支持它的浏览器可能会出错),您不应该使用 iframe.document (它是非标准的,甚至没有被msdn记录),您应该始终添加 'px' 单位(即可以很好地处理它,您需要它在标准模式)。

    function change_height(iframe) {
        var doc= 'contentDocument' in iframe? iframe.contentDocument : iframe.contentWindow.document;
        iframe.style.height= doc.body.offsetHeight+'px';
    }
    
        2
  •  1
  •   Aditya Kresna Permana    11 年前

    试着用这个

    function change_height(iframe) {
        var doc= 'contentDocument' in iframe? iframe.contentDocument : iframe.contentWindow.document;
        iframe.style.height= doc.body.scrollHeight+'px';
    }
    

    我还修改了jquery要使用的代码

    (function($) {
        $.fn.ZIAutoHeight = function() {
            var t = this, doc = 'contentDocument' in t[0]? t[0].contentDocument : t[0].contentWindow.document;
            t.css('height', doc.body.scrollHeight+'px');
        }
    })(jQuery);
    

    用法 $('iframe').ZIAutoHeight(); 希望有帮助