html 自动Iframe调整大小没有跨源问题

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html 自动Iframe调整大小没有跨源问题相关的知识，希望对你有一定的参考价值。

<iframe id="superiFrame" src="..." style="width: 100%; border: none;" scrolling="no" height="500"></iframe>

<script type="text/javascript">
  window.addEventListener('message', function(e) {
    var iframe = document.getElementById('superFrame');
    var eventName = e.data[0];
    var height = e.data[1];
    switch(eventName) {
      case 'setIframeHeight':
        iframe.height = height;
        break;
    }
  }, false);
</script>
<body onLoad="resizeParent();">
  
<script type="text/javascript">
  function resizeParent() {
    var height = document.getElementsByTagName("html")[0].scrollHeight;
    window.parent.postMessage(["setIframeHeight", height], "*");
  }
</script>

</body>

以上是关于html 自动Iframe调整大小没有跨源问题的主要内容，如果未能解决你的问题，请参考以下文章

禁用 iframe 自动调整大小

将 iframe 内容高度设置为动态自动调整大小

动态调整 iframe 大小

生成IFRAME以自动调整页面大小

怎么让iframe的大小跟随内容的大小自动调整?

完成所有 jquery ajax 请求后如何调整 iframe 的大小