Abfangen von Var die leer sind, somit kein NaN als Ausgabe

[Gunnar Bittersmann]

@@Sana

Es funktioniert, das vorab. Aber ist es auch so richtig?

Nein.

<form name="formular" action="">

Der Wert des action-Attributs darf nicht leer sein. Du willst kein action-Attribut setzen.

<input type="text" name="input1" class="form-control" placeholder="0" onkeyup="calculate()"/>

Dem Eingabefeld fehlt seine Beschriftung (label). Auch wenn sehenden Nutzern die Funktion des Feldes klar ist, sollte das Ding dennoch eine Beschriftung haben – diese kann dann visuell versteckt sein.

Es gibt andere Eingabeformen als Keyboard. keyup ist nicht das Event, auf das zu lauschen ist, sondern input.

Eventhandler sollten nicht im HTML notiert werden (on…-Attribute), sondern im JavaScript (EventTarget.addEventListener()). Man braucht auch nicht einen Eventhandler für jedes Eingabefeld, sondern nur einen fürs Formular (event delegation).

<span  class="form-control" id="output">000</span> 

Zur Ausgabe gibt es ein entsprechendes HTML-Element (Ich musste das Wiki erstmal berichtigen, bevor ich das verlinken konnte. Vielleicht kann noch jemand drüberschauen, ob die Formulierung so verständlich ist.)

 	input1 = parseFloat( document.formular.input1.value.replace(/,/ , ".") );

Es ist nicht nötig, das Komma in einen Punkt umzuwandeln. Für Eingabefelder vom Typ number gibt’s da HTMLInputElement.valueAsNumber.

	if (typeof(input1)=="number" && input1+""=="NaN") { var input1 =0; }	

Zum Vorbelegen von Werten kann man in JavaScript den ||-Operator nutzen.

	document.getElementById("output").innerHTML= (input1 + input2 + input3).toString().replace(/\./ , ",");	

Es ist nicht nötig, den Punkt durch Komma zu ersetzen. Das erledigt Number.toLocaleString().

Das Ganze kannst du dir bei diesem Addierer ansehen.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!