Text einer ID ändern

[Twilo]

Hallo,

ich möchte, dass wenn man Text in einer Textarea eingibt, dass dieser Text dann als Vorschau im HTML Dokument schon ausgegeben wird

wie muss ich das ganze angehen?
hier im Forum wollte mal einer etwas ähnliches, nur beim Suchen hab ich es nicht gefunden, wie heisst soetwas überhaupt?

wie sieht das ganze dann eigentlich aus, wenn er ein Zeilenvorschub einfügt, wird das bei der Ausgabe auch als solches dann angezeigt?

das muss ja irgendwie mit getElementByID funktionieren, nur wie :-?

mfg
Twilo

[daniel84]

Hallo Twilo,

ich möchte, dass wenn man Text in einer Textarea eingibt, dass dieser Text dann als Vorschau im HTML Dokument schon ausgegeben wird

<form name="formular">
  <textarea name="textfeld"></textarea><br />
  <input type="button" onClick="document.getElementById('vorschau').innerHTML = document.formular.textfeld.value;" />
</form>

<p id="vorschau"></p>

wie sieht das ganze dann eigentlich aus, wenn er ein Zeilenvorschub einfügt, wird das bei der Ausgabe auch als solches dann angezeigt?

Nein. Da musst du etwas mit replace() basteln, grob geschätzt etwas in der Art von

var vormals = document.formular.textfeld.value;
var jetzt = vormals.replace(/\n/g,"<br />");

Die beiden Lösungsteile zusammensetzen darfst du jetzt aber selber - sollst ja auch etwas lernen ;)

Gruss aus Luzern,
Daniel

[Twilo]

Hallo,

ich möchte, dass wenn man Text in einer Textarea eingibt, dass dieser Text dann als Vorschau im HTML Dokument schon ausgegeben wird

<form name="formular">
  <textarea name="textfeld"></textarea><br />
  <input type="button" onClick="document.getElementById('vorschau').innerHTML = document.formular.textfeld.value;" />
</form>

<p id="vorschau"></p>

hatte das auch gerade durch Zufall gefunden :-)
nur du warst beim posten etwas schneller

wie sieht das ganze dann eigentlich aus, wenn er ein Zeilenvorschub einfügt, wird das bei der Ausgabe auch als solches dann angezeigt?

Nein. Da musst du etwas mit replace() basteln, grob geschätzt etwas in der Art von

var vormals = document.formular.textfeld.value;
var jetzt = vormals.replace(/\n/g,"<br />");

Die beiden Lösungsteile zusammensetzen darfst du jetzt aber selber - sollst ja auch etwas lernen ;)

wie gut, dass ich JavaScript nicht so perfekt behersche, aber ich versuche mal mein Glück :)

mfg
Twilo

[Twilo]

Hallo,

<p id="ausgabe">text</p>
<form action="...">
  <textarea onkeyup="document.getElementById('ausgabe').firstChild.nodeValue=this.value">text</textarea>
</form>

soweit bin ich schon, nur habe ich das Problem, dass ein Zeilenumbruch nur als Leerzeichen angezeigt wird, gibt es eine Möglichkeit, dass es als <br /> ausgegeben wird (also bei der Ausgabe auch als Zeilenvorschub)?

mfg
Twilo

[daniel84]

Hallo Twilo,

<textarea onkeyup="document.getElementById('ausgabe').firstChild.nodeValue=this.value">text</textarea>

Ersetze mal "this.value" durch "this.value.replace(/\n/g,"<br />");" - bin aber nicht sicher, obs so einfach geht...

Gruss aus Luzern,
Daniel

[Twilo]

Hallo,

<textarea onkeyup="document.getElementById('ausgabe').firstChild.nodeValue=this.value">text</textarea>

Ersetze mal "this.value" durch "this.value.replace(/\n/g,"<br />");" - bin aber nicht sicher, obs so einfach geht...

nein leider nicht, gibt mir dann <br /> aus, hatte das vorher in eien Funktion gepackt und das selbe Ergebnis bekommen

hab das als Ausgabe bekommen :-/
test <br />test

mfg
Twilo

[Twilo]

Hallo,

ich möchte, dass wenn man Text in einer Textarea eingibt, dass dieser Text dann als Vorschau im HTML Dokument schon ausgegeben wird

wie sieht das ganze dann eigentlich aus, wenn er ein Zeilenvorschub einfügt, wird das bei der Ausgabe auch als solches dann angezeigt?

ich hab jetzt eine Lösung
<script type="text/JavaScript">
function ausgabe(string) {
  string = string.replace(/</g, '&lt;');
  string = string.replace(/>/g, '&gt;');
  string = string.replace(/\n/g, '<br />');
  eval('document.getElementById("ausgabe").innerHTML = string');
}
</script>
<p id="ausgabe">bla</p>
<form action="...">
  <textarea cols="80" rows="10" onkeyup="ausgabe(this.value);">bla</textarea>
</form>

Firefox, K-Meleon, Opera und der Internet Explorer ändern den Inhalt von Id :-)

kann man die replace-Anweisungen auch irgendwie in einer Zeile schreiben?

mfg
Twilo

[Twilo]

Hallo,

[...]
eval('document.getElementById("ausgabe").innerHTML = string');

es reicht auch
document.getElementById('ausgabe').innerHTML = string;

mfg
Twilo