请教FF下怎么取得IFRAME的scrollHeight
日期：2014-05-16 浏览次数：20360 次
请问FF下如何取得IFRAME的scrollHeight？
为了自适应高度，需要取得IFRAME的scrollHeight。
只是在FF下，取得的值明显要小，不正确，不知道是何原因。
有兄弟姐妹知道吗？或者有其它方法取得IFrame的内容高吗？
讨论讨论。
在下一向喜欢自己动手解决问题，极少提问，今比较急，没时间好好研究，只好请教各位了。
高分送上。
谢谢。
注，页面带：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
------解决方案--------------------
看看这个
function iframeAutoFit()
{
try
{
if(window!=parent)
{
var a = parent.document.getElementsByTagName( "IFRAME ");
for(var i=0; i <a.length; i++) //
{
if(a[i].contentWindow==window)
{
var h = document.body.scrollHeight;
if(document.all) {h += 4;}
if(window.opera) {h += 1;}
a[i].style.height = h;
}
}
}
}
catch (ex)
{
alert( "脚本无法跨域操作！ ");
}
}
if(document.attachEvent) window.attachEvent( "onload ", iframeAutoFit);
else window.addEventListener( 'load ', iframeAutoFit, false);
------解决方案--------------------
mark up
------解决方案--------------------
document.body.scrollHeight直接取应该就行了
------解决方案--------------------
var o=window.parent.document.getElementById( "frameContainer ");
if (o)
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
直接这样呢?
------解决方案--------------------
在网上找到的一个解决办法:
<table>
<tr> <td> <div id= "leftMenu "> <!-- 左边的菜单 --> </div> </td>
<td id= "frameContainer " > <iframe scrolling= "no " frameborder= "no " name= "main "> </td> </tr>
</table>
设想是让iframe里面的页面去改变父窗口的iframe的高和宽。 </p> <p> 以下是第一次尝试：
function dyjustifyframe()
{
var o =window.parent.document.getElementsByName( "main ")[0];
o.height= document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
把function dyjustifyframe()放在iframe中嵌套的子页面里，让子页面的body onLoad= "dyjustifyframe() "。但是iframe并没有height和width属性，所以上面不能这样写。于是找到第二个方法。用修改 iframe 上级的table的大小来间接改变其大小。先给iframe加上
style= "width:100%;height:100% "
使其随着外面table的大小改变而改变。于是把 dyjustifyframe()改成：
function dyjustifyframe()
{
var o=window.parent.document.getElementById( "frameContainer ");
if (o)
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
}
上面的代码在ie中没问题，但在ff中调试时发现子页面的长度超出屏幕的话scrollHeight就只能变大不能变小，所以如果从一个长页面转到一个短页面的话父页面的长度不会改变。所以还需要修改一下。
function dyjustifyframe()
{
var o= window.parent.document.getElementById( "frameContainer ");
if (o)
{
if (navigator.appName == "Netscape ")
{
o.height = document.body.offsetHeight + 40;
o.width = document.body.offsetWidth + 20;
}
else
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
}
}
要确保显示正常，还需要保证 frameContainer和leftMenu外面的td的大小没被设定，此外body的height必须是默认的auto，如果body是100%就会使代码失效。
为了自适应高度，需要取得IFRAME的scrollHeight。
只是在FF下，取得的值明显要小，不正确，不知道是何原因。
有兄弟姐妹知道吗？或者有其它方法取得IFrame的内容高吗？
讨论讨论。
在下一向喜欢自己动手解决问题，极少提问，今比较急，没时间好好研究，只好请教各位了。
高分送上。
谢谢。
注，页面带：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
------解决方案--------------------
看看这个
function iframeAutoFit()
{
try
{
if(window!=parent)
{
var a = parent.document.getElementsByTagName( "IFRAME ");
for(var i=0; i <a.length; i++) //
{
if(a[i].contentWindow==window)
{
var h = document.body.scrollHeight;
if(document.all) {h += 4;}
if(window.opera) {h += 1;}
a[i].style.height = h;
}
}
}
}
catch (ex)
{
alert( "脚本无法跨域操作！ ");
}
}
if(document.attachEvent) window.attachEvent( "onload ", iframeAutoFit);
else window.addEventListener( 'load ', iframeAutoFit, false);
------解决方案--------------------
mark up
------解决方案--------------------
document.body.scrollHeight直接取应该就行了
------解决方案--------------------
var o=window.parent.document.getElementById( "frameContainer ");
if (o)
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
直接这样呢?
------解决方案--------------------
在网上找到的一个解决办法:
<table>
<tr> <td> <div id= "leftMenu "> <!-- 左边的菜单 --> </div> </td>
<td id= "frameContainer " > <iframe scrolling= "no " frameborder= "no " name= "main "> </td> </tr>
</table>
设想是让iframe里面的页面去改变父窗口的iframe的高和宽。 </p> <p> 以下是第一次尝试：
function dyjustifyframe()
{
var o =window.parent.document.getElementsByName( "main ")[0];
o.height= document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
把function dyjustifyframe()放在iframe中嵌套的子页面里，让子页面的body onLoad= "dyjustifyframe() "。但是iframe并没有height和width属性，所以上面不能这样写。于是找到第二个方法。用修改 iframe 上级的table的大小来间接改变其大小。先给iframe加上
style= "width:100%;height:100% "
使其随着外面table的大小改变而改变。于是把 dyjustifyframe()改成：
function dyjustifyframe()
{
var o=window.parent.document.getElementById( "frameContainer ");
if (o)
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
}
上面的代码在ie中没问题，但在ff中调试时发现子页面的长度超出屏幕的话scrollHeight就只能变大不能变小，所以如果从一个长页面转到一个短页面的话父页面的长度不会改变。所以还需要修改一下。
function dyjustifyframe()
{
var o= window.parent.document.getElementById( "frameContainer ");
if (o)
{
if (navigator.appName == "Netscape ")
{
o.height = document.body.offsetHeight + 40;
o.width = document.body.offsetWidth + 20;
}
else
{
o.height = document.body.scrollHeight;
o.width = document.body.scrollWidth;
}
}
}
要确保显示正常，还需要保证 frameContainer和leftMenu外面的td的大小没被设定，此外body的height必须是默认的auto，如果body是100%就会使代码失效。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
