Baseline Widely available *
Das <form>
HTML-Element repräsentiert einen Abschnitt eines Dokuments, der interaktive Steuerungen zum Ãbermitteln von Informationen enthält.
<form action="" method="get" class="form-example">
<div class="form-example">
<label for="name">Enter your name: </label>
<input type="text" name="name" id="name" required />
</div>
<div class="form-example">
<label for="email">Enter your email: </label>
<input type="email" name="email" id="email" required />
</div>
<div class="form-example">
<input type="submit" value="Subscribe!" />
</div>
</form>
form.form-example {
display: table;
}
div.form-example {
display: table-row;
}
label,
input {
display: table-cell;
margin-bottom: 10px;
}
label {
padding-right: 10px;
}
Es ist möglich, die :valid
und :invalid
CSS-Pseudoklassen zu verwenden, um ein <form>
-Element basierend darauf zu stylen, ob die elements
innerhalb des Formulars gültig sind.
Dieses Element umfasst die globalen Attribute.
accept
Veraltet
Komma-separierte Inhaltstypen, die der Server akzeptiert.
Hinweis: Dieses Attribut ist veraltet und sollte nicht mehr verwendet werden. Stattdessen verwenden Sie das accept
-Attribut auf <input type=file>
-Elementen.
accept-charset
Die vom Server akzeptierte Zeichenkodierung. Die Spezifikation erlaubt einen einzelnen wertunabhängigen Wert von "UTF-8"
, was die Allgegenwärtigkeit dieser Kodierung widerspiegelt (historisch konnten mehrere Zeichenkodierungen als komma- oder leerzeichengetrennte Liste angegeben werden).
autocapitalize
Steuert, ob eingegebener Text automatisch groÃgeschrieben wird und, falls ja, wie. Weitere Informationen finden Sie auf der Seite des globalen Attributs autocapitalize
.
autocomplete
Gibt an, ob Eingabefelder standardmäÃig automatisch vom Browser vervollständigt werden können. autocomplete
-Attribute auf Formularelementen überschreiben es auf <form>
. Mögliche Werte:
off
: Der Browser sollte Einträge nicht automatisch vervollständigen. (Browser neigen dazu, dies für vermutete Anmeldeformulare zu ignorieren. Siehe Verwaltung der automatischen Vervollständigung für Anmeldefelder.)on
: Der Browser kann Einträge automatisch vervollständigen.name
Der Name des Formulars. Der Wert darf nicht die leere Zeichenfolge sein und muss innerhalb der form
-Elemente der Formularsammlung eindeutig sein, in der es sich befindet, falls vorhanden. Der Name wird zu einer Eigenschaft der Window
-, Document
- und document.forms
-Objekte, die eine Referenz auf das Formularelement enthält.
rel
Kontrolliert die Annotationen und welche Arten von Links das Formular erstellt. Annotationen umfassen external
, nofollow
, opener
, noopener
und noreferrer
. Link-Typen umfassen help
, prev
, next
, search
und license
. Der rel
-Wert ist eine leerzeichengetrennte Liste dieser enumerierten Werte.
Die folgenden Attribute steuern das Verhalten bei der Formularübermittlung.
action
Die URL, die die Formularübermittlung verarbeitet. Dieser Wert kann durch ein formaction
-Attribut auf einem <button>
, <input type="submit">
oder <input type="image">
-Element überschrieben werden. Dieses Attribut wird ignoriert, wenn method="dialog"
gesetzt ist.
enctype
Wenn der Wert des method
-Attributs post
ist, ist enctype
der MIME-Typ der Formularübermittlung. Mögliche Werte:
application/x-www-form-urlencoded
: Der Standardwert.multipart/form-data
: Verwenden Sie dies, wenn das Formular <input>
-Elemente mit type=file
enthält.text/plain
: Nützlich zu Debugging-Zwecken.Dieser Wert kann durch formenctype
-Attribute auf <button>
, <input type="submit">
oder <input type="image">
-Elementen überschrieben werden.
method
Die HTTP-Methode zur Ãbermittlung des Formulars. Die einzigen erlaubten Methoden/Werte sind (unabhängig von der GroÃschreibung):
post
: Die POST
-Methode; Formulardaten werden als Anforderungskörper gesendet.get
(Standard): Die GET
-Methode; Formulardaten werden an die action
-URL mit einem ?
-Separator angehängt. Diese Methode sollte verwendet werden, wenn das Formular keine Nebeneffekte hat.dialog
: Wenn das Formular in einem <dialog>
ist, schlieÃt es den Dialog und verursacht, dass ein submit
-Ereignis bei der Ãbermittlung ausgelöst wird, ohne Daten zu übermitteln oder das Formular zu löschen.Dieser Wert wird durch formmethod
-Attribute auf <button>
, <input type="submit">
oder <input type="image">
-Elementen überschrieben.
novalidate
Dieses boolesche Attribut gibt an, dass das Formular nicht validiert werden soll, wenn es übermittelt wird. Wenn dieses Attribut nicht gesetzt ist (und das Formular daher validiert wird), kann dies durch ein formnovalidate
-Attribut auf einem <button>
, <input type="submit">
oder <input type="image">
-Element, das zum Formular gehört, überschrieben werden.
target
Gibt an, wo die Antwort nach der Ãbermittlung des Formulars angezeigt werden soll. Es ist ein Name/Schlüsselwort für einen Browsing-Kontext (zum Beispiel Tab, Fenster oder iframe). Die folgenden Schlüsselwörter haben besondere Bedeutungen:
_self
(Standard): In den gleichen Browsing-Kontext laden wie den aktuellen._blank
: In einen neuen unbenannten Browsing-Kontext laden. Dies erzeugt dasselbe Verhalten wie das Setzen von rel="noopener"
, das window.opener
nicht festlegt._parent
: In den übergeordneten Browsing-Kontext des aktuellen laden. Wenn kein Elternteil vorhanden ist, verhält sich wie _self
._top
: In den obersten Browsing-Kontext laden (d.h. der Browsing-Kontext, der ein Vorfahren des aktuellen ist und keinen Elternteil hat). Wenn kein Elternteil vorhanden ist, verhält sich wie _self
._unfencedTop
: Lädt die Antwort von einem Formular in einem eingebetteten fenced frame in den obersten Rahmen (d.h. über die Wurzel des fenced frame hinaus, anders als andere reservierte Ziele). Nur innerhalb von fenced frames verfügbar.Dieser Wert kann durch ein formtarget
-Attribut auf einem <button>
, <input type="submit">
oder <input type="image">
-Element überschrieben werden.
<!-- Form which will send a GET request to the current URL -->
<form method="get">
<label>
Name:
<input name="submitted-name" autocomplete="name" />
</label>
<button>Save</button>
</form>
<!-- Form which will send a POST request to the current URL -->
<form method="post">
<label>
Name:
<input name="submitted-name" autocomplete="name" />
</label>
<button>Save</button>
</form>
<!-- Form with fieldset, legend, and label -->
<form method="post">
<fieldset>
<legend>Do you agree to the terms?</legend>
<label><input type="radio" name="radio" value="yes" /> Yes</label>
<label><input type="radio" name="radio" value="no" /> No</label>
</fieldset>
</form>
Ergebnis Technische Zusammenfassung Spezifikationen Browser-Kompatibilität Siehe auch
<button>
, <datalist>
, <fieldset>
, <input>
, <label>
, <legend>
, <meter>
, <optgroup>
, <option>
, <output>
, <progress>
, <select>
, <textarea>
.HTMLFormElement.elements
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4