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>

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

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
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?

Erstelle ein Benutzerkonto oder melde Dich an, um zu kommentieren

Du musst ein Benutzerkonto haben, um einen Kommentar verfassen zu können

Benutzerkonto erstellen

Neues Benutzerkonto für unsere Community erstellen. Es ist einfach!

Neues Benutzerkonto erstellen

Anmelden

Du hast bereits ein Benutzerkonto? Melde Dich hier an.

Jetzt anmelden
 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...