SELFHTML: HTML/XHTML / Formulare / Versteckte Elemente
Author: Redaktion SELFHTML, selfhtml81@selfhtml.org
Description: Wie Sie in HTML-Formularen versteckte Elemente definieren können und wozu diese Möglichkeit gedacht ist.
Keywords: SELFHTML, HTML, XHTML, Formulare, hidden-Felder, versteckt, unsichtbar, input, type, name, value
Date: 2005-10-31T12:25:34+01:00

| # Versteckte Elemente
| Versteckte Elemente in Formularen definieren Weitere Informationen

## Versteckte Elemente in Formularen definieren

Sie können Felder in einem Formular definieren, die dem Anwender nicht angezeigt werden. Versteckte Felder können Daten enthalten. Beim Absenden des Formulars werden die Daten versteckter Felder mit übertragen. Auf diese Weise können Sie beispielsweise zusätzliche Informationen an CGI-Scripts übergeben oder erläuternden Text einfügen, der bei der E-Mail-Übertragung der Formulardaten in der E-Mail mit enthalten ist.

Auch für JavaScript ist diese Möglichkeit interessant. Da ein JavaScript Formularfelder problemlos auslesen und deren Werte auch ändern kann, ist es auf diese Weise bequem möglich, interne Daten zu speichern, die nicht am Bildschirm angezeigt werden. So könnte ein JavaScript beispielsweise, nachdem die Seite mit dem Formular beim Anwender geladen ist, Informationen zur Bildschirmauflösung beim Anwender sammeln (siehe Screen-Objekt) und die Ergebnisse in ein verstecktes Formularfeld schreiben. Die Daten werden dann, wenn der Anwender das Formular abschickt, mit übertragen.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
           "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Versteckte Elemente in Formularen definieren</title>
    </head>
    <body>

    <h1>Feedback</h1>

    <form name="Feedback" action="input_hidden.htm">
      <p>
        <input type="hidden" name="UserBrowser" value="">
        Ihr Kommentar:<br>
        <textarea name="UserKommentar" rows="2" cols="20"></textarea><br>
        <input type="submit" value="senden"><br>
      </p>
      <script type="text/javascript">
        document.Feedback.UserBrowser.value = navigator.appName;
      </script>
    </form>

    </body>
    </html>

### Erläuterung:

Mit `<input type="hidden">` definieren Sie versteckte Felder in einem Formular (input = Eingabe, hidden = versteckt). Die Daten selbst bestimmen Sie beim Attribut `value` (value = Wert).

Im obigen Beispiel erhält das versteckte Formularfeld zunächst keine Daten (`value=""`). Unterhalb des Formulars ist jedoch ein JavaScript notiert. Dieses Script ermittelt den Browser, den der Anwender verwendet, und schreibt den ermittelten Wert in das versteckte Formularfeld. Wenn der Anwender das Formular absendet, wird also der verwendete Browser als Formularinhalt mit übertragen. Das Ergebnis wird in der Adresszeile sichtbar.

Auf die JavaScript-Anweisung wird hier nicht weiter eingegangen. Innerhalb der JavaScript-Dokumentation in diesem Dokument finden Sie die entsprechenden Befehle in der Objektreferenz beschrieben. Maßgeblich sind das navigator-Objekt und das forms-Objekt mit seinen Unterobjekten.

## Weitere Informationen

In der HTML-Referenz finden Sie Angaben darüber, wo das hier beschriebene Formularelement vorkommen darf, welche Attribute erlaubt sind und was bei den einzelnen Attributen zu beachten ist:
Element-Referenz für Input-Formularelemente (`<input>`)
Attribut-Referenz für Input-Formularelemente (`<input>`)

| Gruppierung von Elementen und Label für Elemente
| Felder für Datei-Upload

© 2007 Impressum