Zum Inhalt springen

Anfänger braucht Hilfe - Formularberechnung

manuel1987

Von manuel1987
in Webdesign

 Teilen

Empfohlene Beiträge

manuel1987

manuel1987

Geschrieben
Geschrieben

Hallo zusammen,

eine Frage zu javascript... Habe noch nie damit etwas gemacht und wollte nun eine Berechnung in einem Formular erstellen...

Darum geht es nur, dass die Felder "kosten", "zins" und "zuschlag" in das Ergebnisfeld "ergebnis" errechnet werden sollen.

Klappt bei mir aber nicht. Ihr könnt mir sicherlich sagen, was ich ändern muss.

Danke im Voraus. :D

<html>

  <head>

    <title>Formular</title>

  </head>

  <body>

  <script type="text/javascript">

function berechnen(f) {


var kosten = f.kosten.value;

var zins = f.zins.value;

var zuschlag = f.zuschlag.value;


f.ergebnis.value = kosten * zins + zuschlag;



}


</script>

    Formular: Einzeilige Eingabenfelder<p>

    <form>

        <p><input type=“text“ name=“kosten“>€ Kosten</p>

   	<p><input type=“text“ name=“zins“>Zinsen</p>

        <p><input type=“text“ name=“zuschlag“>Zuschlag</p>

	<p><input type="button" name="berechnen" value="Berechnung starten" onClick="berechnen" (this.form)></p>

   	<p><input type=“text“ name=“ergebnis“>Gesamt</p>


   </form>

  </body>

</html>

Link zu diesem Kommentar
Auf anderen Seiten teilen
l0rdseth

l0rdseth

Geschrieben
Geschrieben 


<html>

  <head>

    <title>Formular</title>

	  <script type="text/javascript">

function berechnen() {


var kosten = document.kostenrechnung.kosten.value;

var zins = document.kostenrechnung.zins.value;

var zuschlag = document.kostenrechnung.zuschlag.value;


document.kostenrechnung.ergebnis.value = ""+kosten * zins + zuschlag;



}


</script>

  </head>

  <body>


    Formular: Einzeilige Eingabenfelder<p>

    <form name="kostenrechnung">

        <p><input type="text" name="kosten">€ Kosten</p>

   	<p><input type="text" name="zins">Zinsen</p>

        <p><input type="text" name="zuschlag">Zuschlag</p>

	<p><input type="button" value="Berechnung starten" onClick="javascript:berechnen();"></p>

   	<p><input type="text" name="ergebnis">Gesamt</p>


   </form>

  </body>

</html>

Hab es mal angepasst. Sollte jetzt auch funktionieren ;)

Hatte direkt deinen Quellcode übernommen und später beim testen festgestellt das es nicht funktionierte sowie ich es umgeschrieben hatte, bis mir dann auffiel das dein button genauso wie die function "berechnung" hiess. Nachdem ich das gelöscht hatte gunktionierte es einwandfrei. Bin nicht der beste in JavaScript aber ich hoffe eine der Pros könnten sich mal dazu äussern wie das ist wenn ein button und eine function den gleichen Namen haben. Soweit ich weiss sollte das nix machen ausmachen.

Gruss L0rdseth

Link zu diesem Kommentar
Auf anderen Seiten teilen
Toothrot

Toothrot

Geschrieben
Geschrieben (bearbeitet) 
document.kostenrechnung.ergebnis.value = ""+kosten * zins + zuschlag;

Das ist falsch, so hängst du zuerst (kosten*zins) und dann zuschlag an einen Leerstring an. Angenommen, alle drei Werte sind fünf, dann wird folgendes gemacht:

""+"5"*"5"+"5"

= ""+25+"5"

= "25"+"5"

= "255"

Um das zu umgehen, müssen Klammern um die Berechnung gesetzt werden. Das reicht allerdings noch nicht. kosten, zins und zuschlag sind Strings, da sie aus Formularfeldern übernommen werden. Die Multiplikation funktioniert, da wird automatisch gecastet, weil es für Strings keine Multiplikation gibt. Der letzte Wert wird allerdings wieder als String angehängt, weil "+" in Javascript der Konkatenations-Operator für Strings ist.

Entweder man castet also die Werte gleich bei der Initialisierung als Number() oder dann bei der Berechnung.

Bearbeitet von Toothrot
Link zu diesem Kommentar
Auf anderen Seiten teilen
manuel1987

manuel1987

Geschrieben
  • Autor
Geschrieben
Das ist falsch, so hängst du zuerst (kosten*zins) und dann zuschlag an einen Leerstring an. Angenommen, alle drei Werte sind fünf, dann wird folgendes gemacht:

""+"5"*"5"+"5"

= ""+25+"5"

= "25"+"5"

= "255"

Um das zu umgehen, müssen Klammern um die Berechnung gesetzt werden. Das reicht allerdings noch nicht. kosten, zins und zuschlag sind Strings, da sie aus Formularfeldern übernommen werden. Die Multiplikation funktioniert, da wird automatisch gecastet, weil es für Strings keine Multiplikation gibt. Der letzte Wert wird allerdings wieder als String angehängt, weil "+" in Javascript der Konkatenations-Operator für Strings ist.

Entweder man castet also die Werte gleich bei der Initialisierung als Number() oder dann bei der Berechnung.

Inwiefern caste ich die Werte?

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

×
 Teilen
Zur Themenübersicht

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Links

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...