molily: Funktion wird nicht ausgeführt

Beitrag lesen

Hallo,

<input type="text" placeholder="Name" name="name">
<input type="text" placeholder="Nachricht" name="message">
<button type="submit" onclick="chat(name,message)"> Senden </button>

Die Variablen name und message existieren hier nicht. (Die <http://de.selfhtml.org/javascript/objekte/window.htm#name@title=globale Variable name> gibt es durchaus, enthält aber nicht, was du erwartest).

Auf der JavaScript-Konsole solltest des Browsers du eine entsprechende Fehlermeldung sehen.

Wenn du den Wert eines Formularfeld auslesen willst, solltest du zuerst das Element ansprechen. Das geht z.B., indem du dem Element eine ID gibst und http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id@title=getElementById benutzt. Den Wert kannst du dann über die http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#input@title=value-Eigenschaft auslesen:

HTML: <input type="text" id="name">

JavaScript:
var name = document.getElementById('name').value;

Die Variable »name« enthält jetzt den String-Wert mit dem eingegebenen Namen.

Hier verstecken sich auch noch einige Fehler:

document.getElementsById("nachrichten").data = "<p>"+name+": "+message+"</p><br>";

Zunächst einmal ist »getElementsById« falsch geschrieben, es muss getElementById heißen. Einzahl, nicht Mehrzahl – es darf nur ein Element mit einer ID geben, IDs sind dokumentweit eindeutig.

Ferner gibt es die Eigenschaft »data« hier nicht. Wahrscheinlich suchst du http://de.selfhtml.org/javascript/objekte/all.htm#inner_html@title=innerHTML. innerHMTL überschreibt den vorhandenen Inhalt, daher würde ich stattdessen ein <http://de.selfhtml.org/javascript/objekte/document.htm#create_element@title=neues Element erzeugen> und http://de.selfhtml.org/javascript/objekte/node.htm#append_child@title=anhängen. Beispiel:

var name = document.getElementById('name').value; // Formularwerte auslesen  
var message = document.getElementById('message').value;  
var p = document.createElement('p'); // Neues p-Element  
p.innerHTML = name + ': ' + message; // Element füllen  
document.getElementById('nachrichten').appendChild(p); // Element einhängen

Grüße & viel Erfolg
Mathias