 Umrechner Längenmaß
Werte aus einem Formularfeld zur Weiterbeerchnung übernehmen. Dazu gibt es mehrere Möglichkeiten. Dieses Beispiel identifiziert das Feld aus dem der Wert entnommen werden soll mittels einer ID.
 25.07.2007, nun mit Prüfung der Eingabe
Untertitel: getElementById
Ein Beispiel mit einer simplen Rechenoperation (Division oder Multiplikation. Es zeigt aber die Übernahme der Werte aus dem Eingabefeld mittels 'getElementById'.
Für JavaScript-Beginner: Das Dezimalzeichen in Rechenoperationen soll ein Punkt nicht ein Komma sein! Ansonsten eine simple Sache. Entweder dividieren oder multiplizieren
EingabeWert / 2.54
EingabeWert * 2.54
Ebenso könnten sie nach diesem Verfahren km in Lichtjahre oder Meilen in mm umrechnen.
Grundsätzlich also eine simple Rechenoperation mit einem Eingabefeld im Formular!
Trotzdem habe ich das Beispiel hier eingetragen, weil die Inhalte des Formularfeldes (Eingabe) hier mit "getElementById" erfasst werden. Diese Aufgabe erledigt ein JavaScript, natürlich,
Vor der Rechenoperation muss der eingetragene Wert dem Formularfeld entnommen werden. Von Vorteil ist natürlich auch eine Überprüfung der Eingabe, schließlich kann man nur mit gültigen Zahlen rechnen.
Wie man den vom Benutzer eingetragenen Wert dem Formularfeld entnimmt erkläre ich hier. Zwei unterschiedliche Verfahren stehen zur Verfügung:
Übernahme der Werte, identifiziert durch Namen
Üblich war bisher die Erfassung mit "entnehme den Inhalt (value) des Formularfeldes mit dem Namen B im Formular mit dem Namen A"
In 4 Schritten zur JavaScript-Anweisung zum Auslesen des Input-Feldes:
in diesem Dokument . im Formular . im Eingabefeld . steht was
document . welches Formular . welches Element . der Wert
document.Formularname.Elementname.value
document.FormularA.EingabefeldB.value
Übernahme der Werte, identifiziert durch ID (get Element By Id)
Hier wird nun so verfahren:
Das Eingabefeld des Formulars bekam eine ID (id="Eingabe")
Nun muss nicht mehr ein Bezug zum Formular hergestellt werden, sondern man bezieht sich direkt auf des Eingabefeld mit dem eindeutigen Indetifikator.
in diesem Dokument.wo-genau.was
document.im Element mit der ID Eingabe.den Wert
document.im Element mit der ID("Eingabe").den Wert
document.getElementById("Eingabe").value
Nähere Erklärungen zur Technik der Übernahme / Übergabe von Werten in einem Formular lesen sie auf der Seite
 Werteübergabe in Formularen
|
WWW.WEB-TOOLBOX.NET
ScriptCode 
ZURÜCK