`
抽风的鱼
  • 浏览: 50098 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

iframe自适应高度 document.body.scrollHeight取值不对

阅读更多

springmv 切换iframe 时发现直接修改iframe src 或者使用 location.href = "“时不起作用

之后才有form 标段提交 在control中返回新网页的地址 才完成了网页切换

 

之后iframe自适应高度有出现了问题 子页面中使用document.body.scrollHeight获取的高度值不对

 

在iframe引用的前一个页面的高度比iframe 引用的次页面高是  document.body.scrollHeight 获取的高度值是上一个页面的 body高度值  导致页面的排版的不美观

 

解决方法是  :

在iframe子页面加载完成时首先将iframe的高度值设置为0(清除上一个子页面的高度影响)  然后通过document.body.scrollHeight获取该子页面的高度值 来设置iframe的高度值

 

代码

子页面中:

$(document).ready(function(){

     window.parent.iFrameHeight();

});

 

在父页面中

function iFrameHeight(){
        var ifm= document.getElementById("smsComptBody");  
        var subWeb = document.frames ? document.frames["smsComptBody"].document :    ifm.contentDocument;  
        if(ifm != null && subWeb != null) {
            $("#smsComptBody").height(0);//此处关键处 莫忘  清除上一个子页面高度的影响
            $("#smsComptBody").height(subWeb.body.scrollHeight);
               //ifm.height = subWeb.body.scrollHeight;
          
        }
    }

分享到:
评论

相关推荐

    iframe高度自适应,多浏览器兼容

    iframe高度自适应,多浏览器兼容 已测试过在ie6,7,8,firefox8,chrom15中通过

    iframe自适应高度

    function SetWinHeight(obj) { var win=obj; if (document.getElementById) ... else if(win.Document && win.Document.body.scrollHeight) win.height = win.Document.body.scrollHeight; } } }

    js获取页面及个元素高度、宽度的代码

    网页可见区域宽: document.body.clientWidth; 网页可见区域高: document.body....网页正文全文高: document.body.scrollHeight; 网页被卷去的高(ff):document.body.scrollTop; 网页被卷去的高(ie): do

    scrollLeft,scrollTop等等详解.pdf

    网页正文全文高: document.body.scrollHeight; 网页被卷去的高: document.body.scrollTop; 网页被卷去的左: document.body.scrollLeft; 网页正文部分上: window.screenTop; 网页正文部分左: window.screenLeft;...

    使两个iframe的高度与内容自适应,且相等

    iframe frameborder=”0″ scrolling=”no” name=”news1″ id=”news1″ onload=”if(document.frames[‘news1’].document.body.scrollHeight>document.frames[‘news2’].document.body.scrollHeight) ...

    兼容主流浏览器的iframe自适应高度js脚本

    兼容主流浏览器的 Iframe 自适应高度,js脚本如下: 代码如下: //iframe 高度自适应 function iframeAutoFit(iframeObj) { setTimeout(function () { if (!iframeObj) return; iframeObj.height = (iframeObj....

    获取页面长宽和滚动条的位置

    } else if(document.body.scrollHeight > document.body.offsetHeight) { // all but IE Mac scrW = document.body.scrollWidth; scrH = document.body.scrollHeight; } else if(document.body) { /...

    关于IFRAME 自适应高度的研究

    关于IFRAME 自适应高度的...现在就把解决方法共享一下 超简单哦 1、建立一个bottom.js的文件,然后输入下面的代码(只有两行哦) parent.document.all(“框架ID名”).style.height=document.body.scrollHeight; pa

    Web遮罩層的實現方式

    document.body.removeChild(document.getElementById("LoadingImg")); } } //遮罩整個IFrame function hideIframeNoImg(level) { var div = document.createElement("div"); var iframe=document....

    javascript获取网页宽高方法汇总

    document.body.clientWidth – 网页可见区域宽 document.body.clientHeight – 网页可见区域高 document.body.offsetWidth ...document.body.scrollHeight – 网页总高 document.body.scrollTop – 有滚动条的时候,向

    Iframe自适应高度绝对好使的代码 兼容IE,遨游,火狐

    try{ var bHeight = iframe.contentWindow.document.body.scrollHeight; var dHeight = iframe.contentWindow.document.documentElement.scrollHeight; var height = Math.max(bHeight, dHeight); ifr

    VB.net捕获整个网页并保存成图像

    scrollHeight = WebBrowser1.Document.Body.ScrollRectangle.Height scrollWidth = WebBrowser1.Document.Body.ScrollRectangle.Width WebBrowser1.Size = New Size(scrollWidth, scrollHeight) Dim bm As New ...

    通过ifame指向的页面高度调整iframe的高度

     2.htm的代码: [removed] function resize() {parent.document.all.ifrm.height=document.body.scrollHeight; parent.document.all.ifrm.width=document.body.scrollWidth; } [removed] <body onload=”...

    多行输入框自适应行数.html

    核心代码" ; line-height:1.6em;" onkeyup="this.style.height=this.scrollHeight-4+'px'"> </textarea>

    js跨域问题之跨域iframe自适应大小实现代码

    [removed] function setHeight(){ var dHeight = document.documentElement.scrollHeight; var t = document.createElement(“div”); t[removed] = ‘<iframe id=”kxiframeagent” src=”...

    iframeless:自动调整 iframe 的大小以匹配其内容的高度并且根本没有滚动条

    iframe.contentDocument.body.scrollHeight || 0, iframe.contentDocument.body.offsetHeight || 0, iframe.contentDocument.clientHeight || 0, iframe.contentDocument.scrollHeight || 0, iframe....

    iframe实用操作锦集

    iframe高度设置为子页面高度 代码如下: //需要使用Jquery $(document).ready(function () { parent.document.getElementById(“ifPage”).style.height = document.body.scrollHeight + “px”; }); iframe高度...

    javascript窗口宽高,鼠标位置,滚动高度(详细解析)

    网页可见区域宽:document.body....document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去的高:document.body.scrollTop 网页被卷去的左:document.body.scrollLeft 网页正文部分上:wi

    不出现滚动条移动表格

    return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight); } function test(){ if (getScrollTop()+getClientHeight()==getScrollHeight()){ alert("到达底部"); }...

    JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)

    网页可见区域宽:document.body....document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去的高:document.body.scrollTop 网页被卷去的左:document.body.scrollLeft 网页正文部分上:wi

Global site tag (gtag.js) - Google Analytics