同域名不同主机下的iframe高度调整

     情况是这样的,一个页面default.html包含一个树状菜单和一个iframe,通过点击菜单项给iframe的src赋值,以实现比较灵活的页面导航。iframe的高度必须进行根据加载的页面自动调整。方法是在被加载的页面中添加一个js函数,让这个函数在页面加载完的时候调用,如下:

<script type="text/javascript">
function resizeFrame() {
    parent.resizeFrame(document.body.scrollHeight); 
}
</script>
</head>
<body onload="resizeFrame();">

用parent指定在父页面,即default.html,调用那里的resizeFrame函数,并把当前页面的全文高度作为参数。default.html中的resizeFrame函数是的样的。

代码
 <script type="text/javascript">
 document.domain 
= "sc.com";
 
function resizeFrame(newHeight) {
     $(
"#contentFrame").css("height", newHeight);
 }
</script>
 <iframe id="contentFrame" name="contentFrame"  style="width:750px;" frameborder="0"></iframe>

用了jquery这个库。这里有句 document.domain = "sc.com"; 这句在某些情况下是必须的。比如同域名但不同主机。例如default.html页面在www.sc.com这个域名下,iframe加载的是mall.sc.com这个域名,这时就要加上这句话,default.html也要加上这句。 因为默认情况下javascrip受”同源策略“(Same-Origin Policy)的限制不能执行。意思是不同域名,不同端口,不同协议(http to https)之间的脚本都不能互相访问。但如果想让同域名不同主机,即类似 a.example.com, b.example.com这样的域名可以互操作的话就要加上这句document.domain = "example.com";  因为默认情况下,document.domain是当前页面的完整域名。 (完)

 

posted on 2010-09-07 13:19  Maxwell Hu  阅读(647)  评论(0编辑  收藏  举报