Mehrere Iframe-Fenster mit dynamischer Höhe

Question

Ich habe eine Webseite mit vier Spalten, die alle versteckte iFrames enthalten. Wenn Sie auf eine der vier Schaltflächen klicken, wird der Inhalt für diese Schaltfläche angezeigt. In diesen iFrames sind Formulare enthalten, deren Höhe zunimmt, wenn ausgeblendete Felder angezeigt werden.

Ich habe mit diesem Javascript versucht:

<script type="text/javascript"> 
    function iframeLoaded() { 
      var iFrameID = document.querySelectorAll("#iframe1, #iframe2, #iframe3, #iframe4")); 
      if(iFrameID) { 
       iFrameID.height = "1900px"; 
       iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px"; 
      } 
     } 
    </script> 

Und hier ist eine meiner iFrames:

<iframe frameborder="0" src="#" id="iframe1" onload="iframeLoaded()" allowtransparency="true" style="width:100%;height:1900px;border:none;" scrolling="no"></iframe> 

Wie kann ich jede meiner iFrames Höhe machen dynamisch auf der Basis der Formen Höhe?

Answer 1

Try Iterieren über jeden Rahmen individuell:

for (var i = 1; i <= 3; i++) { 
    var frame = document.getElementById("frame" + i); 
    frame.style.height = "1900px"; 
    frame.style.height = contentWindow.document.body.scrollHeight + "px"; 
}