JavaScript Problem mit iFrames und JavaScript

D

Dravis

0
Hallo,
ich habe ein Problem mit einem JS und stehe hier irgendwie auf dem Schlauch. Ich versuche das Problem mal etwas vereinfacht darzustellen.
Im Firebug habe ich den folgenden Code
HTML: 
<html>
  <body>
      ......
      <iframe id="masterFrame">
        <html>
            <body>
                <iframe id="slaveFrame">
                    <html>
                      <body>
                          <!-- SOME CODE -->
                          <div id="myDiv">
                                <!--- SOME CODE -->
                          </div>
                      </body>
                    </html>
                </iframe>
            </body>
        </html>
      </iframe>
      ......
  </body>
</html>

Ich möchte nun den DIV-Container aus dem iFrame "slaveFrame" mittels JS "herausheben", was mit folgendem JavaScript wunderbar funktioniert-

HTML: 
<html>
  <body>
      ......
      <iframe id="masterFrame">
        <html>
            <body>
                <iframe id="slaveFrame">
                    <html>
                      <body>
                          <!-- SOME CODE -->
                          <div id="myDiv">
                              <!--- SOME CODE -->
                              <script>
                                 var myDiv = document.getElementById("myDiv");
                                 window.frameElement.parentNode.appendChild(myDiv);
                              </script>
                          </div>
                      </body>
                    </html>
                </iframe>
            </body>
        </html>
      </iframe>
      ......
  </body>
</html>
Das funktioniert auch problemlos, der Code sieht anschließend im Firebug wie folgt aus:

HTML: 
<html>
  <body>
      ......
      <iframe id="masterFrame">
        <html>
            <body>
                <iframe id="slaveFrame">
                    <html>
                      <body>
                      </body>
                    </html>
                </iframe>
                <div id="myDiv">
                  <!--- SOME CODE -->
                  <script>
                      var myDiv = document.getElementById("myDiv");
                      window.frameElement.parentNode.appendChild(myDiv);
                   </script>
                 </div>
            </body>
        </html>
      </iframe>
      ......
  </body>
</html>

Mein Problem ist, ich will es noch einmal machen und aus dem masterFrame hängen und das will nicht klappen
icon_neutral.gif
Also ein erneutes

HTML: 
window.frameElement.parentNode.appendChild(myDiv);
funktioniert nicht. Wo liegt mein Denkfehler ?

Danke
 
Mein Problem ist, ich will es noch einmal machen und aus dem masterFrame hängen und das will nicht klappen
icon_neutral.gif
Also ein erneutes
Zum Vergrößern anklicken....
Dem kann ich nicht ganz folgen - wo genau machst du das nochmal?
 
Chromatin hat gesagt.:
Dem kann ich nicht ganz folgen - wo genau machst du das nochmal?
Zum Vergrößern anklicken....
Ich glaube er möchte mit dem Div erst aus dem "slaveFrame" und dann auch noch aus dem "masterFrame" ausbrechen.


main-page.html
HTML: 
<html>
    <head>
        <title>Test</title>
        <style>
            iframe {
                border: none;
                width: 80%;
                height: 500px;
            }
        </style>
    </head>
    <body>
      <p>Outer Master</p>
      <iframe id="masterFrame" src="master-iframe.html">
        
      </iframe>
     </body>
</html>

master-iframe.html
HTML: 
<html>
    <head>
        <title>Master</title>
        <style>
            iframe {
                border: none;
                width: 100%;
                height: 100%;
            }
        </style>
    </head>
    <body>
    <p>Outer Slave</p>
        <iframe id="slaveFrame" src="slave-iframe.html">
            
        </iframe>
        <script type="text/javascript">
            document.addEventListener("DOMSubtreeModified", function() {
                var myDiv = document.getElementById("myDiv");
                if (myDiv) {
                    window.frameElement.parentNode.appendChild(myDiv);
                }
            }, false);
        </script>
    </body>
</html>
slave-iframe.html
HTML: 
<html>
    <head>
        <title>Slave</title>
        <style>
            iframe {
                border: none;
                width: 100%;
                height: 100%;
            }
        </style>
    </head>
  <body>
    <p>Inner Slave</p>
      <!-- SOME CODE -->
      <div id="myDiv">
          <p>Ich will raus hier!</p>
          <script type="text/javascript">
            var myDiv = document.getElementById("myDiv");
            if (myDiv) {
                window.frameElement.parentNode.appendChild(myDiv);
            }
          </script>
      </div>
  </body>
</html>

So sollte es funktionieren, Du brauchst im Master iFrame einen EventListener der auf Veränderungen im DOM lauscht. Dein Code funktioniert deshalb nicht, weil der Javascript Code-Block zwar mit verschoben wird, aber nicht mehr ausgeführt.
 
Um antworten zu können musst du eingeloggt sein.
Zurück
Oben