動態增加iframe的高度

Question

我在一個頁面中插入了iframe。 加載子頁面時，我使用以下代碼動態設置iframe的值：

父頁面：

`<iframe src="/test.do" id="iframeTest">`
function setIframeHeight(height) {
$("#iframeTest").height(height);
}

子頁面：test.jsp：

  <div id="test">
  <table>The whole content will be inside this div</table> 
  </div>
    $(document).ready(function() {
    var height = $("#test").outerHeight();
    parent.setIframeHeight(height);
        }

現在，每當子頁面的高度增加時（即，每當包含新的<tr> ），我都將調用parent.setIframeHeight() ，以使iframe的高度增加。 我對此進行了測試，對我來說效果很好。 我想知道是否是增加iframe高度的正確方法？ 還是有其他選擇。

Answer 1

請嘗試以下操作：如果您的子頁面內容連續更改或在某些時間間隔后更改：

setInterval(function(){iframeLoaded}, 2000);

function iframeLoaded() {
  var iFrameID = document.getElementById('iframeTest');
  if(iFrameID) {
        // here you can make the height, I delete it first, then I make it again
      iFrameID.height = "";
      iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";
  }   
 }