Per JavaScript HTML-Elemente (Text, Steuerelemente, Bilder, etc.

[tschroeder]

Hallo,

bin hier fast am Verzweifeln. Google wie ein Wahnsinniger, aber bin für sämtliche Foren-Posts und Dokus zu behindi :-(

Problem:

Befinde mich in einem Window-Objekt, das einen Iframe enthält (Name: iframe_insert).
Nun möchte ich wissen, ob folgende Möglichkeiten bestehen:

• Einen Text aus dem Ursprungsfenster (im body) in den Iframe zu kopieren (nicht in ein Steuerelement, sondern in das "document").

• Noch doller: Könnte ich ganze Objekte, bspw. Steuerelemente, Bilder, komplette div's, den body, den kompletten Inhalt des Ursprungsfensters in den Iframe kopieren?

Habe eine ganze Weile rumprobiert, mit CreateRange(), execCommand('Copy') und execCommand('Paste').
Mir fehlt aber der Überblick, der Zusammenhang, ein roter Faden, das "große Ganze"... und nach stundenlangem Googlen hängt mir jetzt die Zunge raus.

Gibt es irgendwo eine Doku, die alles umfasst (und die ich verstehe)?
Habe regulär kein Problem mit JavaScript, die Grundlagen sind vorhanden, da ich viel client-seitig mit JavaScript mache.
Nur das obige Thema ist komplett neu für mich. Habe nur gehört, dass diese ganzen Funktionen v.a. bei browserbasierten WYSIWYG-Editoren zum Einsatz kommen.

Der Code braucht bei mir nur im IE zu funktionieren.
Wäre für eine Intranet-Anwendung, die ohnehin den IE voraussetzt (auch wegen unzähliger Modaler Dialoge, client-seitigem ActiveX usw.).

Freue mich auf Feedback. Vielleicht komme ich ja einen Schritt weiter...

Gruß aus dem sonnigen Stuttgart

Thomas

[suit]

Google wie ein Wahnsinniger

du sollst vernünftig suchen :)

• Einen Text aus dem Ursprungsfenster (im body) in den Iframe zu kopieren (nicht in ein Steuerelement, sondern in das "document").

kommt drauf an, ob du auf beides zugriff hast (same origin)

• Noch doller: Könnte ich ganze Objekte, bspw. Steuerelemente, Bilder, komplette div's, den body, den kompletten Inhalt des Ursprungsfensters in den Iframe kopieren?

ob du 3 zeichen oder das halbe dom kopierst spiel keine rolle

Gibt es irgendwo eine Doku, die alles umfasst (und die ich verstehe)?

http://aktuell.de.selfhtml.org/artikel/javascript/fensterzugriff/ das hier vielleicht?

Habe regulär kein Problem mit JavaScript, die Grundlagen sind vorhanden, da ich viel client-seitig mit JavaScript mache.
Nur das obige Thema ist komplett neu für mich. Habe nur gehört, dass diese ganzen Funktionen v.a. bei browserbasierten WYSIWYG-Editoren zum Einsatz kommen.

wysiwyg-editoren arbeiten selten mit iframes

Freue mich auf Feedback. Vielleicht komme ich ja einen Schritt weiter...

ich hab noch nicht ganz verstanden, wo dein problem liegt

[tschroeder]

Hallo suit,

habe kein Problem mit der Navigation zwischen Fenstern, Iframes usw. :-)

Möchte nur wissen, ob ich mit execCommand(...) einzelne Elemente (DIV, IMG, etc.) oder ganze Seiten-/Fensterinhalte einfach woanders hinkopieren kann (in einen Iframe, in ein anderes Fenster, in ein DIV, in ein document usw. usw.).

Ich glaube, dass es geht ... hab's gelesen, gehört usw. Außerdem habe ich mir einen browserbasierten WYSIWYG-Editor angesehen, der mit diesen Funktionen arbeitet.

Da ich aber den Zusammenhang nicht kenne, kann ich mit dem Code irgendwie nix anfangen. Ich habe nur gesehen, dass dort Elemente hin und her kopiert und verschoben werden und dass dabei die Befehle CreateRange() und execCommand() verwendet werden.

Möchte so was ähnliches wie eine Snapshot-Funktionalität bereitstellen.
Dass das nix 100%iges wird, davon gehe ich mal aus. Interessiert mich trotzdem, ob so etwas in der Richtung mit JavaScript möglich ist.

Wie gesagt, es geht darum, (client-seitig) Teile einer Seite bzw. eines Fensters in ein anderes Fenster zu kopieren - innerhalb eines bestehenden Projektes. Heißt, ich weiß, wie die Fenster und Iframes heißen und wie der Inhalt strukturiert ist.

Vielleicht weißt Du ja, ob es irgendwo eine entsprechende JS-Doku gibt, die die Sachen (CreateRange, execCommand, ...) abdeckt?

Gruß

Thomas

[suit]

Vielleicht weißt Du ja, ob es irgendwo eine entsprechende JS-Doku gibt, die die Sachen (CreateRange, execCommand, ...) abdeckt?

msdn ist immer eine gute anlaufstelle

[Felix Riesterer]

Lieber tschroeder,

die Sache mit dem Selection- oder dem Range-Objekt ist eine sehr tückische. Der IE verwendet dafür einen völlig anderen Mechanismus, als das z.B. der FF tut. Es gibt wohl eine Richtlinie des W3C, aber wenn's halt im IE wieder anders läuft... Näheres in den Dokus zu den jeweiligen Browsern (Stichworte "selection object" und "range object").

Du hast da ein extrem komplexes Vorhaben, das Du am besten irgendwie anders löst. Erlaube Deinen Usern simples Copy & Paste, damit wirst Du wahrscheinlich besser fahren.

Liebe Grüße,

Felix Riesterer.

[Felix Riesterer]

Lieber suit,

Habe nur gehört, dass diese ganzen Funktionen v.a. bei browserbasierten WYSIWYG-Editoren zum Einsatz kommen.

wysiwyg-editoren arbeiten selten mit iframes

und woher nimmst Du diese unzutreffende Information? Der TinyMCE, als auch der FCKEditor benutzen beide einen Iframe, um das darin enthaltene Dokument in contentEditable oder DesignMode zu schalten... Und diese WYSIWYG-Editoren (manche nennen sie auch RTEs) sind wohl zwei der verbreitetsten!

Liebe Grüße,

Felix Riesterer.

[suit]

und woher nimmst Du diese unzutreffende Information? Der TinyMCE, als auch der FCKEditor benutzen beide einen Iframe - htmlarea ebenfalls

die wichtigen, komplexen editoren schon - aber eine vielzahl der kleinen "wischi-waschi"-editoren sind bei weitem nicht so gefinkelt

wenn man gros der editoren weglässt, ist das natürlich richtig - diese verwenden durch die bank ein iframe

allerdings wird das iframe durch den editor selbst erzeugt und besitzt als quelltext ebenfalls lediglich durch javascript generierten code

[tschroeder]

Hallo,

ich mach's jetzt ganz einfach: "Klaue" den OuterHTML-Code aus dem jeweiligen Dokument. Is' simpel in der Umsetzung, aber ein "echter" Snapshot. Hab' das Ganze durchgetestet und ist genau das, was ich brauche.

Gruß, Danke für's Feedback und einen guten Rutsch :-)

Thomas