游多多驿站分销iframe高度自适应解决方案

    在做分销的时候经常会遇到一种合作模式，就是提供内容页的iframe让分销商签到到自己的网页中。这种合作模式工作量小，开发进度快，但是有一个弊端就是iframe高度不可控制，原因就是iframe的引入是跨域的。在跨域的情况下父窗口无法获得被嵌套页面的高度，而且被嵌套页面也无法通过驻留在其服务器上的js修改父窗口Dom节点的属性。所以我们需要一个媒介，来获得被嵌套页面的高度同时又能修改主界面iframe节点的高度。

案例分析：网站主：多多驿站（www.yododo.cn） 分销商：（www.qugow.com）

网站主提供内容页地址（http://hoteldistr.yododo.com?_id=5 ）用（B.html代称） 分销频道网址（http://www.qugow.com/inn/） （用main.html代称），分销商提供的用来控制B.html高度的中间页A.html

思路如下： 在现有主界面main的域a下，被嵌套页面B下，被嵌套页面B又嵌套又嵌套一个在域a下的中间页面A，当用户打开浏览器访问main.html时候载入B，触发B的onload事件获取自身的高度，然后载入A，并将B的高度作为参数传给A的location对象，这样A就可以通过location.hash获得B的高度。由于A和main页面同域，所以可以修改main的dom节点属性，从而达到我们设置iframe标签高度的目的。

相关代码：

iframe的主页面：main.html

<div id="hotels_i">

<iframe src="http://hoteldistr.yododo.com/?_id=5" name="inn" id="inn" style="width:100%;height:725px;" frameborder="0" scrolling="no"></iframe>

</div>

iframe嵌套页面：B.html

<iframe id="contorlDistrIframe" name="contorlDistrIframe" src="" width="0" height="0" style="display:none;" ></iframe>

      <script type="text/javascript">

        function sethash(){

          hashH = document.body.scrollHeight; //获取自身高度

          urlC = "${sessionScope.mm_distr.controlIframeUrl}"; //中间页url，调整iframe高度的 为A.html

          document.getElementById("contorlDistrIframe").src=urlC+"#"+hashH; //将高度作为参数传递

        }

        window.onload=sethash;

      </script>