jquery实现iframe自适应高度

来源：互联网发布：校园网络安全教育编辑：程序博客网时间：2024/05/21 07:53

iframe因为能和网页无缝结合，所以可以不刷新页面更新页面的部分数据。
可是 iframe的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行。
分享2种使用jquery实现iframe自适应高度的代码

iframe代码，注意要写ID。

<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

jquery代码一：

//注意：下面的代码是放在test.html调用 $(window.parent.document).find("#main").load(function(){ var main = $(window.parent.document).find("#main"); var thisheight = $(document).height()+30; www.jbxue.commain.height(thisheight); });

jquery代码二：

//注意：下面的代码是放在和iframe同一个页面调用 $("#main").load(function(){ var mainheight = $(this).contents().find("body").height()+30; $(this).height(mainheight); });

0 0