关于iframe的高度自适应问题

/* 
*比如有两个页面a.html 和b.html 
*我们要做的是在a.html里面的iframe里面引入b.html,b.html里面的实际内容高度有多少,a.html里面的iframe的高度就有多少, 
*随着b.html里面的高度的变化 iframe的高度也在自适应的变化 
*/ 



1.首先我们先来看a.html 
<html> 
      <head> 
          <script type="text/javascript" src="....这里引入的我就不写了"> 
                //这里我用jQuery来取得iframe的src 
                jQuery(document).ready(function(){ 
                        document.all.thisIframe.src = "b.html"; 
                }); 
          </script> 
      </head> 

      <body> 
           <!--这里我们不在iframe里面写src,我们要让被引入的html先进行编译,要不我们会得不到被引入html的高度,我们可以用js或者用jQuery写一个方法得到src 
            --> 
           <iframe height="100%" width="100%" scrolling="no" frameborder="0" name="thisIframe" id="thisIframe"> 

           </iframe> 
      </body> 
</html> 

2.我们来看在b.html里面要加些什么 
<html> 
     <head> 

     </head> 
     <!--请看好在body里面写了什么东西,下面的thisIframe代表iframe的id,下面的form1代表这个html的form的id 一般的我们引入的html都会有一个form,获得body的高度往往不准确,这里我们直接获取form的实际内容的高度  ---> 
     <body οnlοad="parent.window.document.all.thisIframe.height=document.form1.scrollHeight"> 
          <form id="form1" action=""> 
               <table> 

               </table> 
          </form> 
     </body> 
</html> 

3.往往这样的话我们就可以在a.html里面的主页面里面看到iframe的高度随着b.html里面的实际内容高度自适应的变化 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值