JS/Jquery: Höhe einer Textarea an Inhalt anpassen?

[Pit]

Guten Tag,

kann ich mit Jquery die Höhe einer Textarea automatisch so weit aufziehen, dass der komplette Inhalt sichtbar ist?

Pit

[Tabellenkalk]

Hallo,

kann ich mit Jquery die Höhe einer Textarea automatisch so weit aufziehen, dass der komplette Inhalt sichtbar ist?

Ob jQuery das direkt kann, weiß ich nicht, aber du könntest in einer Schleife die Höhe solange vergrößern, bis keine Scrollleiste mehr verwendet wird.

Gruß
Kalk

[TS]

Hello,

kann ich mit Jquery die Höhe einer Textarea automatisch so weit aufziehen, dass der komplette Inhalt sichtbar ist?

Guck mal, ob Dir element.scrollHeight etwas nützt.

Liebe Grüße
Tom S.

[Regina Schlauklug]

Zähle einfach die Zeilen (Zeilenumbrüche!) im Inhalt.

rows=text.split("\n").length 

könnte reichen. Dann musst Du nur die Höhe in Abhängigkeit von line-hight (kannst Du auch setzen) und paddings des Bereiches berechnen und mit css setzen.

[TS]

Hello,

Zähle einfach die Zeilen (Zeilenumbrüche!) im Inhalt.

rows=text.split("\n").length 

könnte reichen. Dann musst Du nur die Höhe in Abhängigkeit von line-hight (kannst Du auch setzen) und paddings des Bereiches berechnen und mit css setzen.

Das ist keinesfalls richtig, da es auch Soft-Breaks gibt, also Fließtextumbrüche. Und die werden nicht mit "\n" dargestellt. Außerdem wandelt der Browser "\n" in der Textarea automatisch in "\r\n" um. Kann allerdings sein, dass das erst beim Senden passiert :-||

Liebe Grüße
Tom S.

[Regina Schlauklug]

Das ist keinesfalls richtig, da es auch Soft-Breaks gibt, also Fließtextumbrüche. Und die werden nicht mit "\n" dargestellt. Außerdem wandelt der Browser "\n" in der Textarea automatisch in "\r\n" um. Kann allerdings sein, dass das erst beim Senden passiert :-||

1. "keinesfalls richtig" erscheint mir "etwas" übertrieben, wenn erst mindestens zwei Umstände eintreten müssen, die nur zusammen zu einer Ungültigkeit der von mir selbst mit "könnte" eingeleiteten Aussage führen. Es gibt zwei Umstände, bei deren einzelnen Eintreten (wrapp ist "on", Zeilen sind zu lang) die Aussage richtig ist. Das "könnte" schließt den logischen Kreis weil es auf Nebenbedingen hinweist.

2. Ob im Text nun die Zeilenenden nach Windows ("\r\n") oder Unix-Manier ("\n") enthalten sind ist bei der gezeigten Vorgehensweise völlig egal. Weil es nur darauf ankommt, die "\n" (genauer die resultierenden Zeilen) zu zählen. Und bei Verwendung von "\r\n" als Zeilenumbruch ist die Zahl der "\n" gleich der der Kombination mit "\r\n"…

[Gunnar Bittersmann]

@@Pit

kann ich mit Jquery die Höhe einer Textarea automatisch so weit aufziehen, dass der komplette Inhalt sichtbar ist?

Dazu fällt mir – nach der Frage

1. Warum sollte man das überhaupt wollen?

– noch Folgendes ein:

2. Über HTMLTextAreaElement.value.length kommt man an die Anzahl der eingegebenen Zeichen; daraus kann man die Anzahl der Zeilen abschätzen.

   Das gelingt sehr gut für Sprachen, in denen Zeilen überall (d.h. auch mitten im Wort) umbrochen werden können, bspw. für Chinesisch. Ansonsten gelingt es umso besser, je kürzer die Wörter sind. Pech für Deutsch: lange zusammengesetze Wörter rutschen in eine neue Zeile, so bleiben etlichen Zeilen halbleer. Empirisch kann man für eine gegebene Sprache und eine gegebene Breite das Verhältnis mittlere genutzte Breite zu vorhandener Breite ermitteln und damit die für die Textlänge benötigte Zeilenanzahl abschätzen.

3. Andere Möglichkeit: Man macht mit JavaScript aus dem textarea-Eingabefeld ein anderes Element wie p oder div, das man auf contenteditable setzt. Das wird dann so hoch dargestellt wie es der aktuelle Inhalt erfordert.

   Man muss das Element dann freilich so kennzeichnen (stylen), dass es für Nutzer als Eingabefeld erkennbar ist – und das auch für alle Nutzer, also ggfs. ARIA-Attribute ergänzen –, und sich auch um die Übertragung des eingegebenen Textes kümmern.

LLAP 🖖