SELFHTML/Quickbar  HTML  Formulare

Einzeilige Eingabefelder
Diese Seite ist ein Dokument mit Informationstext

 Einzeilige Eingabefelder definieren
 Textvorbelegung bei einzeiligen Eingabefeldern
 Eingabefelder für Passwörter
 Eingabefelder auf "nur lesen" setzen
 Weitere Möglichkeiten
 

HTML2.0 Einzeilige Eingabefelder definieren

Einzeilige Eingabefelder dienen zur Aufnahme von einem oder wenigen Wörtern oder einer Zahl.

Beispiel Anzeigebeispiel: So sieht's aus

Beispiel:

Ihr Spitzname: <input name="Spitzname" size=60 maxlength=60>
<br>
Ihr Lieblings-Star: <input type=text name="LieblingsStar" size=40 maxlength=40>
<br>
Ihre heimliche Leidenschaft: <input name="Leidenschaft" size=30 maxlength=60>

Erläuterung:

<input ... > definiert ein einzeiliges Eingabefeld (input = Eingabe). Der Vollständigkeit halber können Sie die Angabe type=text dazusetzen.

Jedes Eingabefeld muß einen internen Bezeichnernamen erhalten, und zwar mit der Angabe name=. Der Name sollte nicht zu lang sein und darf keine Leerzeichen und keine deutschen Umlaute enthalten. Verwenden Sie als Sonderzeichen höchstens den Unterstrich "_". Setzen Sie den Namen in Anführungszeichen.

Ferner sollten Sie bei einzeiligen Eingabefeldern immer die Anzeigelänge in Zeichen mit size= sowie die interne Feldlänge in Zeichen maxlength= bestimmen. Beide Angaben bedeuten die Anzahl Zeichen (size = Größe, maxlength = maximal length = maximale Länge). Wenn die interne Feldlänge maxlength größer ist als die angezeigte Feldlänge size (wie im dritten der obigen Beispiele), dann wird bei längeren Eingaben automatisch gescrollt (im Beispiel also ab dem 41. eingegebenen Zeichen).

Beispiel 2:

<form>
<table>
  <tr>
    <td align=right>Ihr Vorname:</td>
    <td><input type=text size=40 maxlength=40></td>
  </tr><tr>
    <td align=right>Ihr Zuname:</td>
    <td><input type=text size=40 maxlength=40></td>
  </tr>
</table>
</form>

Erläuterung:

Das Beispiel zeigt, wie Sie mit Hilfe einer  blinden Tabelle Beschriftung und Eingabefelder eines Formulars ordentlich formatieren können.

Beachten Sie:

Mit Hilfe von  JavaScript können Sie die Eingaben von Anwendern vor dem Absenden des Formulars kontrollieren. So können Sie zum Beispiel erzwingen, daß in einem Eingabefeld eine Zahl in einem bestimmten Wertebereich eingegeben wird usw. Innerhalb dieser Dokumentation finden Sie ein Anwendungsbeispiel  Formulareingaben überprüfen.

 

HTML3.2 Textvorbelegung bei einzeiligen Eingabefeldern

Beispiel Anzeigebeispiel: So sieht's aus

Sie können ein einzeiliges Eingabefeld mit einem Inhalt vorbelegen.

Beispiel:

Ihre Lieblings-URL: 
<input name="LieblingsURL" maxlength=40 size=40 value="http://www.teamone.de/selfhtml/">

Erläuterung:

Eingabefelder mit vorbelegtem Inhalt werden wie gewöhnliche  Eingabefelder definiert. Mit dem zusätzlichen Attribut value= können Sie einen Text angeben, mit dem das Feld vorbelegt wird (value = Wert). Der Text muß in Anführungszeichen stehen.

 

HTML3.2 Eingabefelder für Passwörter

Beispiel Anzeigebeispiel: So sieht's aus

Für die Eingabe von Geheimnummern, Paßwörtern usw. gibt es einen speziellen Typ von Eingabefeld. Die eingegebenen Zeichen werden dabei durch Platzhalter (meistens Sternchen) dargestellt, so daß Personen im Raum des Anwenders nicht zufällig das eingegebene Passwort mitlesen können.

Beispiel:

Ihre Zugangsnummer: <input type=password name="Zugangsnummer" maxlength=10 size=10>

Erläuterung:

Eingabefelder für Passwörter werden wie gewöhnliche  Eingabefelder definiert. Mit der zusätzlichen Angabe type=password bestimmen Sie, daß es sich um ein Passwort-Feld handelt.

Beachten Sie:

Passwörter werden trotz der verdeckten Eingabe im Klartext über das Internet übertragen. Weisen Sie Anwender in ernsthaften Zusammenhängen auf diese Tatsache bitte explizit hin.

Ein Paßwortfeld in HTML allein ist noch keine Abfrage für geschützte WWW-Seiten. Bitte kontaktieren Sie beim Wunsch, paßwortgeschützte WWW-Seiten anzubieten, Ihren Provider. Lesen Sie zu diesem Thema auch aufmerksam den Abschnitt  WWW-Projekte publizieren.

 

HTML4.0 Eingabefelder auf "nur lesen" setzen

Beispiel Anzeigebeispiel: So sieht's aus

Sie können erzwingen, daß ein "Eingabefeld" kein Eingabefeld mehr ist, sondern eigentlich nur ein Ausgabefeld. Das kann beispielsweise interessant sein, wenn Sie  JavaScript-ermittelte Werte in einem Formularfeld ausgeben möchten.

Beispiel:

<input name="Ausgabe" maxlength=10 size=10 readonly>

Erläuterung:

Mit dem Attribut readonly können Sie ein Eingabefeld (<input>) auf "nur lesen" setzen.

Beachten Sie:

Der MS Internet Explorer interpretiert diese Angabe seit Version 4.x, Netscape in der Version 4.x noch nicht.

 

HTML4.0 Weitere Möglichkeiten

Das <input>-Tag kann  Universalattribute enthalten.

Es ist durchaus auch erlaubt,  CSS Style-Sheets auf Formularelemente anzuwenden. Leider interpretiert Netscape solche Möglichkeiten in der Produktverion 4.x noch nicht. Der MS Internet Explorer 4.x interpretiert CSS Style-Sheets im Zusammenhang mit Formularelementen. Dazu müssen Sie zunächst wissen, wie man  Style-Sheets definieren kann. Anschließend sind Sie in der Lage, Style-Sheet-Angaben anzuwenden. Auf das <input>-Tag können Sie beispielsweise folgende Style-Sheet-Angaben anwenden:
 Schriftformatierung
 Hintergrundfarben und -bilder
 Elemente positionieren


 
weiter: Mehrzeilige Eingabefelder
zurück: Formulare definieren
 

SELFHTML/Quickbar  HTML  Formulare

© 1998  Stefan Münz, muenz@csi.com

1