Ergebnis 1 bis 6 von 6
  1. #1
    jstraum ist offline Grünschnabel
    registriert
    22-06-2015
    Beiträge
    7

    Scriptproblem Anfänger, einfaches Formular und Rechnen

    Hallo,

    ich bin aktuell blutiger Javascript Anfänger und hab schon einige Tutorials gelesen, aber bekomme schon diesen simplen Code nicht zum Laufen:


    HTML-Code:
          <script type="text/javascript">
            <!--
            //document.write("<p>JAVASCRIPTCODE DEFAULT fuer ALLE RECHNER</p>");
            // 1. Variablen festlegen/reinladen 
    
           function fktberechnen() {             
    
            var var613, var614, var615,  ergebnis2, varleer;
            var varleer = "";         
            var var613 = parseInt(document.getElementById("var613").value);
    var var614 = parseInt(document.getElementById("var614").value);
    var var615 = parseInt(document.getElementById("var615").value);
                    
            // 2. Formel reinladen + berechnen nach Formel
            ((var613*var613*var613))*(var614/100)=var615;        
             //document.meinrechner1.ergebnis2.value = var615;
            document.getElementById('ergebnis2').innerHTML = var615;
            }
            -->
          </script>
          
          <form id="meinrechner1">
            FEld 1 <input type="text" size="40" id="var613"> 
            Feld 2: <input type="text" size="40" id="var614">
                     <div style="border:1px solid #000000;width:100px;height:20px;" id="ergebnis2"></div>
                    
            <a href="#"  onclick="fktberechnen();">rechnen</a>  
          </form>

    Kann mir jemand einen Tipp geben, was da falsch ist?

    Vielen Dank an die Experten.

    Viele Grüße
    Olaf
    Geändert von jstraum (22-06-2015 um 14:51 Uhr)

  2. #2
    paul schmitz ist offline Doppel-As
    registriert
    29-03-2015
    Beiträge
    134

    AW: Scriptproblem Anfänger, einfaches Formular und Rechnen

    Das Element mit der Id var615 gibt's doch gar nicht ...

    Schaue das nächste mal in der Fehlerkonsole (Firefox: Strg+Umschalt+K, Chrome: Strg+Umschalt+I) nach Fehlern!
    Lösung hatte ich deshalb in 15 Sekunden.

    Zudem habe ich das Script noch etwas verschönert (beinhaltet Korrektur):
    HTML-Code:
    <script type="text/javascript">
           function fktberechnen() {             
    
            var var613, var614, var615,  ergebnis2, varleer="";      
            var var613 = parseInt(document.getElementById("var613").value);
            var var614 = parseInt(document.getElementById("var614").value);
                    
            var615=((var613*var613*var613))*(var614/100);
            document.getElementById('ergebnis2').innerHTML = var615;
            }
          </script>
          
          <form id="meinrechner1">
            Feld 1 <input type="text" size="40" id="var613"> 
            Feld 2: <input type="text" size="40" id="var614">
                     <div style="border:1px solid #000000;width:100px;height:20px;" id="ergebnis2"></div>
                    
            <a href="#"  onclick="fktberechnen();">rechnen</a>  
          </form>

  3. #3
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.685

    AW: Scriptproblem Anfänger, einfaches Formular und Rechnen

    Dein Code produziert einen Fehler in der Fehlerkonsole... es existiert kein <input> mit der ID "var615" (was übrigens keine gute ID ist - besser ist es immer sprechende Namen zu verwenden. Auch bei den Variablen.)

    Zusätzlich noch ein paar Tipps zu deinem Code:
    1. vergiss document.write()
    2. HTML-Kommentare in JS-Code sind unnötig und können Probleme bereiten... oder willst du wirklich noch den Mosaic unterstützen?
    3. sicherheitshalber sollte man parseInt() als zweiten Parameter die Basis des Zahlensystems mitgeben. Ältere Browser können sonst unerwartete Ergebnisse liefern. Ich persönlich würde ja parseFloat() nehmen - dann kann man auch Kommazahlen eingeben (ACHTUNG! Das Dezimalzeichen in JS ist ein Punkt und kein Komma. Das müsstest du vor dem Parsen entsprechend umwandeln)
    4. Wenn nichts oder keine Zahl in das <input> eingegeben wird, liefert parseInt() (und auch parseFloat()) ein NaN (Not a Number). Um diesen Fall abzudecken kannst du einen Defaultwert definieren, indem du folgendes Konstrukt verwendest:
    Code:
    var var613 = parseInt(document.getElementById("var613").value) || 0;
    5. Die Variablenzuweisung (=) ist nicht vertauschbar. So ist a = b nicht das gleiche wie b = a. So darfst du auf die rechte Seite keine Rechenanweisung schreiben, wie du es gemacht hast. Richtig heißt es (die Klammern sind nicht falsch, aber überflüssig):
    Code:
    var615 = var613*var613*var613*var614/100;
    6. Dein Code ist nicht sauber formatiert. Du solltest dir gleich ganz zu Anfang angewöhnen, deinen Code sauber zu formatieren. Macht das Lesen/Verstehen/Warten viel einfacher.
    7. Das href="#" im <a> ist sinnfrei. Wenn du etwas in einer bestimmten Weise im Browser dargestellt haben möchtest, solltest du CSS verwenden.
    8. Da du deine Daten nicht an einen Server sendest, ist das <form> komplett überflüssig.
    9. Es gibt das schöne neue HTML5-Element <output> - das würde ich anstatt dem <div> verwenden.

    Zum Schluss könnte dein Code so aussehen:
    Code:
    <!DOCTYPE html>
    
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Fenstertitel</title>
    <style type="text/css">
    a[onclick] {
    	color: blue;
    	text-decoration: underline;
    	cursor: pointer;
    }
    #ergebnis2 {
    	display: block;
    	border: 1px solid #000000;
    	width: 100px;
    	height: 20px;
    }
    </style>
    </head>
    <body>
    	Feld 1: <input type="text" size="40" id="var613"> 
    	Feld 2: <input type="text" size="40" id="var614">
    	<output id="ergebnis2"></output>
    	<a onclick="fktberechnen();">rechnen</a>
    	<script>
    		function fktberechnen(){
    			var var613 = parseInt(document.getElementById("var613").value);
    			var var614 = parseInt(document.getElementById("var614").value);
    			// 2. Formel reinladen + berechnen nach Formel
    			var615 = var613*var613*var613*var614/100;
    			document.getElementById('ergebnis2').value = var615;
    		}
    	</script>
    </body>
    </html>

  4. #4
    jstraum ist offline Grünschnabel
    registriert
    22-06-2015
    Beiträge
    7

    AW: Scriptproblem Anfänger, einfaches Formular und Rechnen

    Tausend dank, aber bitte nicht hauen... ich sehe es einfach nicht... :-(

    Das Element ist doch da : var615
    // 2. Formel reinladen + berechnen nach Formel
    ((var613*var613*var613))*(var614/100)=var615;

    Ist es relevant, dass erst die berechnung und dann das ergebnis kommt??

    ich steig nicht durch...

  5. #5
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.685

    AW: Scriptproblem Anfänger, einfaches Formular und Rechnen

    Zitat Zitat von jstraum Beitrag anzeigen
    Das Element ist doch da : var615
    Die Variable ist da, aber nicht das Element im HTML mit der ID "var615".

    Zitat Zitat von jstraum Beitrag anzeigen
    Ist es relevant, dass erst die berechnung und dann das ergebnis kommt?
    Ja - das ist auch ein Fehler.

    PS: Vorher ist anscheinend der Link nicht reingekommen: Fehlerkonsole (Wo finde ich die Fehlerkonsole?)

  6. #6
    jstraum ist offline Grünschnabel
    registriert
    22-06-2015
    Beiträge
    7

    AW: Scriptproblem Anfänger, einfaches Formular und Rechnen

    Ich habe es jetzt noch einmal geändert. Muss aber noch ein Fehler drin sein, sieht den jemand?
    Code:
          <script type="text/javascript">
            <!--        
            // 1. Variablen festlegen/reinladen, dynamisch in PHP durchlaufen
            function fktberechnen() {}
                
              var var82, var83, var84, var85, var86, var87, var88,  varleer; 
              varleer = "";                  
              var var82 = document.getElementById('var82').value;
    var var83 = document.getElementById('var83').value;
    var var84 = document.getElementById('var84').value;
    var var85 = document.getElementById('var85').value;
                                                                        
              // 2. Formel reinladen + berechnen nach Formel
              var var87=var84+(2*var82)+0.6;
    var var88=var83+(2*var82)+0.6;
    var var86=var88*var87*var85;          
    document.getElementById('var86').innerHTML = var86;
    document.getElementById('var87').innerHTML = var87;
    document.getElementById('var88').innerHTML = var88;
                                                    
            }
            -->
          </script>
    Ähm, mit der Fehlerkonsole hab ich Probleme, muss ich mir erst noch genauer anschauen...

    danke.

    - - - Aktualisiert - - -

    oh nein, ich bin so blind.... oben ist die klammer versehentlich gleich wieder geschlossen.... oh man...

Ähnliche Themen

  1. "Warenkorb" Formular zum rechnen nutzen
    Von shiromas im Forum JavaScript
    Antworten: 33
    Letzter Beitrag: 13-03-2011, 14:22
  2. Antworten: 8
    Letzter Beitrag: 17-11-2010, 01:55
  3. Vereinfachung? Formular + Rechnen
    Von HalloGehn im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 13-04-2007, 10:40
  4. einfaches mail formular/newsletter
    Von peters im Forum JavaScript
    Antworten: 5
    Letzter Beitrag: 02-04-2006, 14:37
  5. Formular + Rechnen
    Von totomoto im Forum Serverseitige Programmierung
    Antworten: 2
    Letzter Beitrag: 26-08-2005, 11:29

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •