Michael: Textarea um formatierten Text ergänzen

Hallo,

Ich habe in unserem HTML-Formular zur Erstellung neuer Einträge Schaltflächen definiert, über die - via JavaScript - formatierter Text in ein Textfeld (Textarea) eingefügt werden soll, beispielsweise kursiv oder unterstrichen.

Klickt man eine Schaltfläche an, dann öffnet sich ein Eingabefenster, das den zu formatierenden Text abfragt.

Hat man seinen Text eingegeben und das Eingabefenster geschlossen, dann sollen der soeben eingegebene Text formatiert an die bisherigen Angaben angehängt werden.

Mein Ansatz sieht beispielsweise folgendermassen aus:

function darstellung(formatierung)
{
  switch(formatierung)
  {
    case "zentriert":
    {
      var text = eingabe("Wie lautet Dein Text, der zentriert dargestellt werden soll ?");
      document.getElementsByTagName("kommentar").innerHTML = text;
      break;
    }
    [...]
  }
}

function eingabe(beschreibung)
{
  return (text = prompt(beschreibung,""));
}

Schrift-Formatierung:

Dass Text mit <i></i> und <u></u> formatiert werden kann, so dass er kursiv oder unterstrichen ausgegeben wird, weiss ich.

Absatz-Formatierung:

Zentrierte Ausrichtung erreiche ich über <center></center>.
<p align="right"> funktioniert, <right> dagegen nicht.

Die Frage ist nun allerdings, wie ich dies dem Textfeld (Textarea) so auch "mitteilen" kann.

Die Anweisung   document.getElementsByTagName("kommentar").innerHTML = "<i>" + text + "</i>"   beispielsweise bringt keine Fehlermeldung, allerdings wird der Text auch nicht angezeigt.

Gruss, Michael

  1. Hallo Michael.

    Mein Ansatz sieht beispielsweise folgendermassen aus:
    [...]
    document.getElementsByTagName("kommentar").innerHTML = text;

    Du verwendest hier innerHTML, das nicht alle Browser verstehen. Dies solltest du auf jeden Fall mittels einer if-Abfrage ermitteln. Weiterhin überschreibst du die gesamte bisher gemachte Eingabe. Eine bessere Vorgehensweise wäre meiner Meinung nach, den eingegebenen Text an die bisherige Angabe dranzuhängen. Darüber hinaus solltest du dich mit dem Zugriff auf Formularelemente mittels DOM beschäftigen:

    http://selfhtml.teamone.de/javascript/objekte/elements.htm

    Die Frage ist nun allerdings, wie ich dies dem Textfeld (Textarea) so auch "mitteilen" kann.

    Gar nicht. Innerhalb einer Textarea werden HTML-Tags nicht als solche behandelt und deshalb auch nicht interpretiert. Willst du eine Art Vorschau haben, musst du einen anderen Weg gehen.

    Die Anweisung   document.getElementsByTagName("kommentar").innerHTML = "<i>" + text + "</i>"   beispielsweise bringt keine Fehlermeldung, allerdings wird der Text auch nicht angezeigt.

    Was genau wird nicht angezeigt, der gesamte Text oder nur die Formatierung?

    Grüße
    Siechfred

    1. Hallo Siechfred,

      Danke für Deine schnelle Antwort :-)))

      document.Testformular.Eingabe.value

      Zugriff auf Formularelemente mittels DOM beschäftigen:
      selfhtml.teamone.de/javascript/objekte/elements.htm]

      Ich habe mich in meinem Ansatz nur auf die Übernahme der Formatierungen konzentriert. Dass ich den Text anhängen muss, ist logisch. Sorry, dass dies zur Verwirrung beigetragen hat :o)

      document.[Name].[Feld].value = alt + neu;

      Willst du eine Art Vorschau haben, musst du einen anderen Weg gehen.

      Könnte man die Vorschau über einen DIV-Bereich lösen ? Darin könnte ich ja Formatierungen anzeigen lassen. Aber halt nur über einen ergänzten Button "Vorschau". In "Echtzeit" dürfte dies wohl nicht möglich werden bzw. den Server sehr belasten.

      Was genau wird nicht angezeigt, der gesamte Text oder nur die Formatierung?

      Der Text wird nicht angezeigt.

      Gruss, Michael

      1. Hallo Michael.

        Könnte man die Vorschau über einen DIV-Bereich lösen ? Darin könnte ich ja Formatierungen anzeigen lassen. Aber halt nur über einen ergänzten Button "Vorschau".

        Ja, so könnte man das lösen.

        Was genau wird nicht angezeigt, der gesamte Text oder nur die Formatierung?
        Der Text wird nicht angezeigt.

        Hm, das könnte seine Ursache in der fehlenden Unterstützung von innerHTML haben. Näheres kann man aber nur sagen, wenn du mal einen Link auf die Problemseite postest.

        Grüße
        Siechfred

        1. Hallo Siechfred,

          Ja, so könnte man das lösen.

          Gut, wird dann auch so erledigt :-)

          Link auf die Problemseite postest

          Den gibt es leider noch nicht. Ich werkle lokal an der Homepage :-)

          Gruss, Michael