Formularfelder verwenden (1)

Formulare ermöglichen eine bequeme Interaktion mit dem Benutzer. Das Formular wird im HTML-Dokument angelegt und muss daher im Body des Dokuments stehen. 

<form name="Datumsformular">
  Gib ein Datum ein: 
<input type="text" name="Eingabe"> <input type="button" value="Start" onClick="Datum_checken()"><br> <input type="text" name="Ausgabe" size="80"> </form>
  • Das erste Element dieses Formulars ist ein Eingabefeld für Text, wie die Bezeichnung type="text" nahelegt. Um später auf das Textfeld zugreifen zu können, ist es wichtig, es mit einem aussagekräftigen Namen zu versehen, wie das hier mit name="Eingabe" erfolgt.
  • Das zweite Element ist ein Button, der mit dem Text "Start" beschriftet ist. Wichtig ist hier, dass mit onClick="Datum_checken()" eine JavaScript Funktion aufgerufen werden kann. Offensichtlich wird, wenn auf den Button geklickt wird, eine Funktion Datum_checken() aufgerufen.
  • Das dritte Element hat hier die Funktion, eine Ausgabe im Dokument zu ermöglichen. Das Textfeld ist 80 Zeichen breit.

Die Elemente des Formulars können mit dem Namen des Formulars und des Formularfeldes angesprochen werden:

  • Man kann mit document.Datumsformular.Ausgabe.value = 'Hallo Feld!' einen Text in das Formularfeld Ausgabefeld schreiben.
  • Auf die gleiche Weise kann man auch Werte aus dem Formularfeld auslesen: vText = document.Datumsformular.Eingabe.value;

Aufgabe A: Lege ein neues HTML-Dokument an und füge das obige Formular im <body> ein. Schreibe eine Funktion Datum_checken(), die dann vom Start-Button aufgerufen werden kann. Hier sollen nur die Daten aus dem oberen Formularfeld (Eingabe) ausgelesen und dann in das untere Formularfeld (Ausgabe) übertragen werden.

Aufgabe B: Schreibe das Programm so um, dass Meilen in Kilometer und umgekehrt umrechnet werden können (eine Meile sind übrigen 1,609 Km). Lege dazu einen zweiten Button an. Die beiden Buttons sollten sinnvoll beschriftet sein und je eine passende Funktion aufrufen: Meilen_Km() bzw. Km_Meilen() Beide Funktionen müssen noch geschrieben werden.

Clemens-August-Gymnasium

Bahnhofstraße 53
49661 Cloppenburg

Tel. 0 44 71 / 94 81 0
Fax 0 44 71 / 94 81 50

E-Mail: Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!

 - Impressum -

Umweltschule

(Bewerbung  als Umweltschule läuft)

 

Europaschule200

Cookies erleichtern die Bereitstellung unserer Dienste. Mit der Nutzung unserer Dienste erklären Sie sich damit einverstanden, dass wir Cookies verwenden.
Ok