的JavaScript在每个浏览器行为不同

我试图使用iframe自动高度，那我服最多的是这样的代码：的JavaScript在每个浏览器行为不同

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> 
<title>THE IFRAME HOLDER</title> 

<script> 
    function alertsize(pixels){ 
    pixels+=32; 
    document.getElementById('myiframe').style.height = pixels+"px"; 
    } 
</script> 

</head> 

<body style="background:silver;"> 
<iframe src='theiframe.htm' style='width:458px;background:white;' frameborder='0' id="myiframe" scrolling="auto"></iframe> 
</body> 
</html>

的Iframe：保存名称为“theiframe.htm”

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> 
<title>IFRAME CONTENT</title> 
<script> 
    function toggle(obj) { 
    var el = document.getElementById(obj); 
    if (el.style.display != 'block') el.style.display = 'block'; 
    else el.style.display = 'none'; 
    parent.alertsize(document.body.scrollHeight); 
} 
</script> 
</head> 

<body onload="parent.alertsize(document.body.scrollHeight); " > 

<a href="javascript:toggle('moreheight')">toggle height?</a><br /> 
<div style="display:none;" id="moreheight"> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
    more height!<br /> 
</div> 
text<br /> 
text<br /> 
text<br /> 
text<br /> 
text<br /> 
text<br /> 
text<br /> 
text<br /> 
THE END 
<div style="clear:both;"></div> 

</body> 
</html>

在IE，Opera和Firefox中，它可以很好地工作。在Chrome和Safari中，似乎不起作用。一位朋友说，这个问题可能是在这里：在Chrome

onload="parent.alertsize(document.body.scrollHeight);"

例子：在Safari http://www.warezexpress.com/ups/2009_setembro/chrome.jpg

例子：（iframe的扩大，不减少） http://www.warezexpress.com/ups/2009_setembro/safari.jpg

但我仍然不明白JavaScript来解决这个问题。我在论坛上准备好了这些代码。谢谢你的任何单词！

来源

2013-04-25 Paulo Diaas

可能的答案在这里：http://stackoverflow.com/questions/3053072/iframe-resizing-with-scrollheight-in-chrome-safari – showdev 2013-04-25 17:27:44

你是什么意思的“不工作”？什么不行？你有没有看到任何错误？ 'alertsize'不叫吗？该参数传递的是不是正确的值？高度不变？发生什么事情不应该发生，应该怎么办？ – 2013-04-25 17:29:30

在Chrome浏览器中，iframe会显示较小的滚动条，隐藏内容。 – 2013-04-25 17:36:28

如果浏览器的兼容性是你挣扎的东西，最好是先从一个框架像jQuery，特别是，如果你不需要使用香草JS任何明确的理由。

来源

2013-04-25 17:26:34

jQuery不总是*答案 – 2013-04-25 17:33:29

我在哪里说'jQuery'总是答案 – 2013-04-25 17:35:28

，根据Paulo发布的内容，jQuery很好可以作为答案。 – 2013-04-25 17:36:31

的JavaScript在每个浏览器行为不同

回答

相关问题