Hallo zusammen,
micht würde mal interessieren, wie die ganzen online HTML Editoren (JavaScript basiert) es machen, das man in einem Textarea Feld den Text markiert und dann z.B. Fett macht. Ich hab mal versucht mich durch den JS-Quelltext von einem dieser Editoren zu kämpfen, aber das war nicht ganz so erfolgreich.
Wie müsste sowas denn generell laufen, das man sowas realisieren kann? In die Details würde ich mich dann selber einarbeiten.
Viele Grüße
Sascha
Hallo Sascha,
micht würde mal interessieren, wie die ganzen online HTML
Editoren (JavaScript basiert) es machen, das man in einem
Textarea Feld den Text markiert und dann z.B. Fett macht. Ich
hab mal versucht mich durch den JS-Quelltext von einem dieser
Editoren zu kämpfen, aber das war nicht ganz so erfolgreich.
Ja, das ist auch wirklich nicht ganz ohne.
Eine Textarea selbst kann keine Formatierungen, die ist nur für Plain-Text geeignet; Formatierungen können Browser darin nicht anzeigen. Deshalb wird von diesen Skripts ein Layer (div) erzeugt, der über der Textarea liegt (von Javascript erzeugt und mit CSS dorthin positioniert). Wird nun Text markiert und auf einen Formatierungsbutton geklickt, z.B. Fett, so wird in der Textarea dieser Bereich von , oder umschlossen. Dem div über der Textarea als HTML zugewiesen (innerHTML) sieht es dann fett aus.
Hier gibt es zahlreiche Hürden - z.B. den markierten Ausschnitt des divs im (HTML-)Text der Textarea zu finden oder ungültige Verschachtelungen ‚aufzuräumen‘.
Wie müsste sowas denn generell laufen, das man sowas
realisieren kann? In die Details würde ich mich dann selber
einarbeiten.
Du kannst Dir die Midas-Demo von Mozilla http://www.mozilla.org/editor/midasdemo/ anschauen (am besten mit dem Fux) - dieses arbeitet mit Hilfe eines iFrames - oder gleich das sehr ausgefeilte und weitestgehend cross-browser kompatible tinymce http://tinymce.moxiecode.com/download.php verwenden, welches das o.g. Prinzip verfolgt.
Schönen Gruß,
Rudy