Funktion wird nicht ausgeführt
0 
Felix Riesterer
0 molily
Funktion wird nicht ausgeführt
Matthias ApselHallo,
Ich habe eine ganz einfache Funktion geschrieben, diese wird jedoch nicht ausgeführt.
Mein Ziel ist es, über zwei Input Boxen, einen Namen und eine Nachricht an eine Funktion zu übergeben, die Funktion soll lediglich dafür sorgen, dass der Name und die Nachricht ganz unten an die Website angehängt wird, wo sich ein tag mit der id "nachrichten" befindet.
Hier ist meine html Seite, beim Teil mit "document.getElementsById" bin ich mir überhaupt nicht sicher:
<html>
<head>
<script type="text/javascript">
chat = function (name, message)
{
document.getElementsById("nachrichten").data = "<p>"+name+": "+message+"</p><br>";
}
</script>
<link rel="stylesheet" href="style.css"/>
<h1 style="text-align:center">eddcapone</h1>
</head>
<body>
<input type="text" placeholder="Name" name="name">
<input type="text" placeholder="Nachricht" name="message">
<button type="submit" onclick="chat(name,message)"> Senden </button>
<p id="nachrichten"> Nachrichten </p>
</body>
</html>
Leider weiss ich nicht wie ich das umsetzen kann, mein Versuch ist gescheitert :/
Vielen Dank im voraus für jede Hilfe!
Gruß eddcapone
-
Liebe(r) eddcapone,
Ich habe eine ganz einfache Funktion geschrieben, diese wird jedoch nicht ausgeführt.
was sagt die Fehlerkonsole Deines Browsers? Ich hätte da so eine Vermutung...
document.getElementsById("nachrichten").data = ...
Wie Du sicher weißt, darf eine ID dokumentweit nur ein einziges Mal vorkommen. Daher lautet die Funktion auch entsprechend im Singular, und nicht wie von Dir fälschlicherweise als Plural notiert!
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:) -
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ängenGrüße & viel Erfolg
Mathias-
Lieber molily,
p.innerHTML = name + ': ' + message; // Element füllenmir ist klar, dass diese "Addition" von Strings einer Verkettung entspricht. Inwiefern ist es aber wünschenswert, Strings so zu verketten, anstatt
String.concat(str1, ": ", str2)zu verwenden? Ist es denn garantiert durch alle bisherigen Sprachversionen von JS so, dass die "Addition" von "1" und "2" keinesfalls "3", sondern immer "12" ist?Ist obiges Beispiel nicht sogar dafür geeignet stattdessen sogar das Folgende zu notieren?
p.innerHTML = name.concat(": ", message);Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)-
Ist es denn garantiert durch alle bisherigen Sprachversionen von JS so, dass die "Addition" von "1" und "2" keinesfalls "3", sondern immer "12" ist?
Ja, sobald ein Operand ein String ist, ist das garantiert.
Hier sind sogar beide Operanden Strings – denn die value-Eigenschaft gibt immer nur Strings zurück.
Ja, das ist seit ECMAScript Edition 1 (1997) so standardisiert:
http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262, 1st edition, June 1997.pdf
Siehe 11.6.1 The addition operator ( + ), Seite 43, Schritt 7:
»7. If Type(Result(5)) is String or Type(Result(6)) is String, go to step 12.
[…]
12. Call ToString(Result(5)).
13. Call ToString(Result(6)).
14. Concatenate Result(12) followed by Result(13).«Vergleich ECMAScript 5.1, 14 Jahre später:
http://www.ecma-international.org/ecma-262/5.1/#sec-11.6.1
»7. If Type(lprim) is String or Type(rprim) is String, then
a. Return the String that is the result of concatenating ToString(lprim) followed by ToString(rprim)«Grüße
Mathias-
Lieber molily,
vielen Dank für diese Klarstellung. Offensichtlich fährt man bei weniger Durchblick in der Sprache mit String.concat sicherer - es sei denn man hat genügend Sachverstand und weiß um die interne Typenumwandlung genügend, dass man
str = 3 + 4 + "a"vermeidet und stattdessenstr = String.concat(3,4,"a")notiert. Gerne auch kürzer mitstr = "".concat(3,4,"a").Interessanterweise hast Du mir auf meine letzte Frage keine Antwort (Deine Meinung dazu) geschrieben:
Ist obiges Beispiel nicht sogar dafür geeignet stattdessen sogar das
Folgende zu notieren?
p.innerHTML = name.concat(": ", message);Wie stehst Du dazu?
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)-
Hallo,
Der Plus-Operator tut immer das, was man erwartet, solange nicht beide Operanden Number-Werte sind. Das sind sie beim Verarbeiten von User-Eingaben so gut wie nie.
Ist obiges Beispiel nicht sogar dafür geeignet stattdessen sogar das Folgende zu notieren?
p.innerHTML = name.concat(": ", message);Möglich ist das, aber warum sollte diese Schreibweise besser sein? Ich finde sie nicht robuster und nicht lesbarer. Wegen des Methodenaufrufs wird sie wahrscheinlich um den Faktor 100 langsamer sein.
Die concat-Methode bei Strings habe ich in freier Wildbahn noch nie gesehen. Wenn ich nicht einmal an der SELFHTML-Methodenreferenz gearbeitet hätte, wäre es mir wahrscheinlich bis heute nicht über den Weg gelaufen. Das scheint mir ein schlecht umgesetztes Java-Relikt zu sein.
Im obigen Beispiel geht man davon aus, dass name ein nicht-null, nicht-undefined Wert ist, der die Methode concat bietet. Kurz gesagt, ich gehe stillschweigend davon aus, dass es ein Wert vom Typ String ist.
Wenn ich diese Annahme mache, dann ist das einfachere
name + ': ' + messagegenauso gut.Wenn ich nicht stillschweigend davon ausgehe, dass es ein String ist, dann ist
name + ': ' + messagesogar besser. Weil der String-Literal ': ' als Operand dafür sorgt, dass der Wert von name gegebenenfalls in einen String umgewandelt wird, falls der Wert eines anderen Types ist.Wenn ich mit verschiedenen Typen rechne und die Typumwandlung explizit machen will, so sind folgende Idiome verbreitet:
-
String-Funktion anwenden:
String(foo) + String(bar) -
Leeren String-Literal voranstellen:
"" + foo + bar
Dieser String-Literal ist »ansteckend« und sorgt dafür, dass die folgende +-Operation mindestens einen String-Operanden hat. Das pflanzt sich fort auf die nachfolgenden +-Operationen, sodass das Endergebnis ein String sein muss.
Grüße
Mathias-
Om nah hoo pez nyeetz, molily!
Der Plus-Operator tut immer das, was man erwartet, solange nicht beide Operanden Number-Werte sind.
Dann auch, vorausgesetzt man erwartet die Summe der Werte (ggf. treten Rundungsprobleme auf)
Matthias
-
-
-
-
-
