pad开发在一个DIV中载入一个html文件问题

Question

我的iframe及外层div代码

<div id="iframe_div_1" class="iframe_div" style="width: 100%;">
                <iframe name="ifraRight" id="ifraRight"  src="" frameborder="0" scrolling="auto"  width="100%"  height="82%" style="border:0;background-color:transparent" border="0" frameborder="0"
                 onload="this.height=window.frames['cjrd'].window.document.body.scrollHeight" scrolling="yes" allowtransparency="yes"></iframe>
                </div>

其中的src是jquery动态写入的
在pad上面打开是会出现出现 界面重叠

但是关闭重新打开之后就不会重叠这个不知道要怎么解决

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

我使用了下面的方法解决了这个问题：

function load_iframe() {
    var iframe = document.getElementById('ifraRight');
    if (!iframe) return;
    // 设置iframe的高度为当前页面的总高度
    iframe.style.height = window.parent.document.body.scrollHeight + 'px';
}

iframe {
    display: none;
    position: absolute;
}

<iframe id="ifraRight" src="" frameborder="0" scrolling="no" onload="load_iframe();"></iframe>

在上述代码中，首先获取到iframe元素，并将其设置为隐藏状态。然后在iframe的onload事件中调用函数load_iframe()，将iframe的高度设置为当前页面的总高度。

这样就可以避免界面重叠的问题。