没有垂直滚动条的跨域iframe调整大小修复

Question

我有一个网站，我在iframe中显示信息。 iframe中的信息来自Salesforce域。正在提取的数据以＆＃34;培训指南＆＃34;有几页。

我在两个域上添加了javascript代码以修复更改的高度，从而删除了Vertical滚动条。 salesforce页面中的代码：

  function retrieveInfo(){
          parent.postMessage(document.body.scrollHeight, '*');
        }

        function showLoading(){
            $('#dvLoading').show();
        }

我的网站页面上写的代码是：

 function resizeCrossDomainIframe(id, other_domain) {
var iframe = document.getElementById(id);
window.addEventListener('message', function(event) {
  var height = parseInt(event.data); // add some extra height to avoid scrollbar
  iframe.height = height + "px";
}, false);

}

我页面中的iframe是：

<iframe id="my_iframe" src="https://cp.secure.force.com/mydomainhome" width="100%"  onload="resizeCrossDomainIframe('my_iframe', 'https://cp.secure.force.com/');" scrolling="yes"></iframe>

iframe内的数据有左窗格和右窗格。左窗格包含可折叠菜单列表，其中显示了相应的课程内容。左侧窗格manu在点击时扩展。我得到的问题是在页面加载时调用用于删除V-scroll的javascript代码，但是一旦页面加载，我点击左侧窗格展开它，v-scroll重新出现。

这是页面加载时页面呈现的方式：

这是我使用内部滚动条展开左窗格菜单后页面呈现的方式：

即使在展开左窗格菜单后，我是否可以阻止显示垂直滚动条。我不想在点击每个左窗格菜单链接时重新加载页面。

Answer 1

会在每个window.resize事件上触发retrieveInfo来解决问题吗？ 通过展开左侧菜单，您基本上调整了iframe窗口的大小。如果您重新发布消息，父窗口中的iframe将相应地重新调整。

我曾使用iframe resizer（https://github.com/davidjbradshaw/iframe-resizer）之类的外部库解决了这个问题 对于不支持＆＃34; postMessage＆＃34;。

的浏览器，这可能会有所帮助