wake-up-neo.com

Den HTML-Inhalt eines Iframes mithilfe von jQuery abrufen

Ich versuche gerade, OpenCms (Java-basiertes Open Source CMS) ein wenig anzupassen, was den eingebetteten FCKEditor verwendet. Dies ist, was ich versuche, Zugriff mit js/jQuery zu versuchen. 

Ich versuche, den HTML-Inhalt des Iframes abzurufen, erhalte jedoch immer null als Rückgabe .. So versuche ich, den HTML-Inhalt aus dem Iframe abzurufen:

var editFrame = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');
alert( $(editFrame).attr('id') );         // returns the correct id
alert( $(editFrame).contents().html() );  // returns null (!!)

Wenn ich mir den Screenshot ansehe, möchte ich auf die HTML-Sektion 'LargeNews1/Teaser' zugreifen, die aktuell die Werte "Newsline en ..." ..__ enthält. Im Folgenden finden Sie auch die HTML-Struktur in Firebug.

Allerdings gibt $(editFrame).contents().html() null zurück und ich kann nicht herausfinden warum, $(editFrame).attr('id') die korrekte ID zurückgibt.

Der iframe-Inhalt/FCKEditor befindet sich an derselben Site/Domäne, es gibt keine Cross-Site-Probleme.

enter image description here

Der HTML-Code von iframe befindet sich unter http://Pastebin.com/hPuM7VUz

Aktualisierte:

hier ist eine Lösung, die funktioniert:

var editArea = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame').contentWindow.document.getElementById('xEditingArea');                        
$(editArea).find('iframe:first').contents().find('html:first').find('body:first').html('some <b>new</b><br/> value');
javascriptjquerydomiframe
23
Mathias Conradt

.contents (). html () funktioniert nicht, um den HTML-Code eines iframe abzurufen. Sie können Folgendes tun, um es zu erhalten:

$(editFrame).contents().find("html").html();

Das sollte alle HTML im Iframe für Sie zurückgeben. Oder Sie können "body" oder "head" anstelle von "html" verwenden, um auch diese Abschnitte zu erhalten. 

49
Tim

sie können den Inhalt als 

$('#iframeID').contents().find('#someID').html();

aber Frame sollte sich in derselben Domain befinden http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

7
Hemant Metalia

Ich schlage vor, die erste Zeile zu ersetzen durch:

  var editFrame = $('#ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');

... und der 2. Alarmausdruck mit:

  editFrame.html()

Wenn Sie es dagegen vorziehen, dieselbe J/E-Abfrage (viel cooler, IMHO) auszuführen, kann nur JavaScript verwendet werden:

  var editFrame = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');
  alert(editFrame.innerHTML);
2
Nathan

Ich denke, der FCKEditor hat eine eigene API, siehe http://cksource.com/forums/viewtopic.php?f=6&t=8368 .

1
Dale Burrell

Nachdem ich eine Reihe von jQuery Lösungen ausprobiert hatte, die die Verwendung der folgenden Option empfohlen hatten, stellte ich fest, dass ich den tatsächlichen <html> - Inhalt einschließlich der übergeordneten Tags nicht abrufen konnte.

$("#iframeId").contents().find("html").html()

Dies funktionierte für mich viel besser und ich konnte den gesamten <html>...</html> Iframe-Inhalt als String abrufen.

document.getElementById('iframeId').contentWindow.document.documentElement.outerHTML

0
Eric Kigathi

Ihr iframe:

<iframe style="width: 100%; height: 100%;" frameborder="0" aria-describedby="cke_88" title="Rich text editor, content" src="" tabindex="-1" allowtransparency="true"/>

Wir können die Daten von diesem iframe erhalten als:

var content=$("iframe").contents().find('body').html();
alert(content);
0
Sudhakar Singajogi