<textarea> soll mit dem Inhalt in der Höhe mitwachsen

[Marco]

Hallöchen miteinander.

Die Problemstellung ist folgende:

Ich möchte auch er Seite eine <textarea> angeben. In diesem Feld kann vom Benutzer Text geschrieben werden.
Nun ist allerdings die Textlänge unbekannt, aber das Textfeld soll mit den Worten "mitwachsen", sodass keine Scrollbalken zu sehen sind.

Nun habe ich schon allerhand in den Suchmaschinen durchforstet, aber noch nicht DIE Lösung gefunden.

Es gibt z.B. Anwendungen (http://james.padolsey.com/javascript/jquery-plugin-autoresize/), aber diese benötigen für das Textfeld eine feste Breite. Da ich aber das Textfeld in einem mehrspaltigen Layout einsetze, beträgt die Breite dessen 100%, sodass der zur Berechnung erzeugte Klon dann 100% Seitenbreite einnimmt. Dadurch ist das Ergebnis für die Höhenberechnung falsch.

Gibt es hierfür eine Lösung (oder auch Lösungsansatz), der das Mitwachsen des Textfeldes ermöglicht?

Vielen Dank
Marco

[ChrisB]

Hi,

Es gibt z.B. Anwendungen (http://james.padolsey.com/javascript/jquery-plugin-autoresize/), aber diese benötigen für das Textfeld eine feste Breite. Da ich aber das Textfeld in einem mehrspaltigen Layout einsetze, beträgt die Breite dessen 100%, sodass der zur Berechnung erzeugte Klon dann 100% Seitenbreite einnimmt. Dadurch ist das Ergebnis für die Höhenberechnung falsch.

Dann lese doch einfach die Breite des „Originals“ aus, und weise sie dem „Klon“ zu.

MfG ChrisB

[Marco]

Hi ChrisB,

das ist zu einfach. ;-)
Das Textfeld liegt in einem <div> Container, der 100% Breite einnimmt. Für dreispaltiges Layout hat dieser nur einen linken und rechten Rand. Damit das Textfeld nun den verfügbaren Platz einnimmt, hat es die Breite von 100%. Beim Auslesen von style.width erhalte ich dann auch die 100%.

Grüße
Marco

[ChrisB]

Hi,

das ist zu einfach. ;-)

Und du schaffst es trotzdem, es zu verkomplizieren.

Beim Auslesen von style.width erhalte ich dann auch die 100%.

Darüber liest man ja auch keine aktuellen Werte aus, sondern nur die Eigenschaften so, wie sie im CSS gesetzt sind.

Um die aktuellen Werte auszulesen, gibt es getComputedStyle.
Das ist zum simplen Auslesen der Breite eines Elements aber auch over-the-top - dazu kann man schlicht und einfach offsetWidth verwenden.

MfG ChrisB

[Marco]

Hi ChrisB,

danke für den Denkansatz - so funktioniert es. Es muss nicht immer so kompliziert sein. Manchmal sieht man den Wald vor Bäume nicht.

Grüße
Marco