HTML5 Formulareigenschaften
HTML5Es wurden einige neue Formulareigenschaften hinzugefügt, form erhielt autocomplete und novalidate, input-Kontrollen erhielten autocomplete, autofocus, form, formaction, formenctype, formmethod, formnovalidate, formtarget, height und width, list, min und max, multiple, pattern (regexp)
HTML5 Neue Formulareigenschaften
HTML5 Die <form>- und <input>-Tags haben einige neue Eigenschaften hinzugefügt.
Neue Eigenschaft des <form>:
Neue Eigenschaft des <input>:
autocomplete
autofocus
form
formaction
formenctype
formmethod
formnovalidate
formtarget
height und width
list
min und max
multiple
pattern (regexp)
placeholder
required
step
<form> / Eigenschaft autocomplete des <input>
Die Eigenschaft autocomplete legt fest, dass das Formular oder der Input-Bereich eine automatische Vervollständigungsfunktion haben sollte.
Wenn der Benutzer mit der Eingabe in das automatische Vervollständigungsfeld beginnt, sollte der Browser die verfügbaren Optionen im Feld anzeigen.
Hinweis: Die autocomplete-Eigenschaft kann im Formularelement aktiviert sein, während sie im Eingabelement deaktiviert ist.
Hinweis: autocomplete ist für den <form>-Tag und die folgenden Typen der <input>-Tags geeignet: text, search, url, telephone, email, password, datepicker, range und color.
Online-Beispiel
HTML-Formular autocomplete aktivieren (ein input-Feld schaltet autocomplete aus):
Hinweis: In einigen Browsern müssen Sie möglicherweise die Funktion "Automatische Vervollständigung" aktivieren, damit diese Eigenschaft funktioniert.
<form> novalidate-Eigenschaft
Die novalidate-Eigenschaft ist eine boolean (布尔值) Eigenschaft.
Die novalidate-Eigenschaft legt fest, dass das Formular oder die Eingabefelder nicht validiert werden sollten, wenn das Formular gesendet wird.
Online-Beispiel
Keine Validierung der übermittelten Formulardaten erforderlich
<input> autofocus-Eigenschaft
Die autofocus-Eigenschaft ist eine boolean-Eigenschaft.
Die autofocus-Eigenschaft legt fest, dass das Feld automatisch den Fokus erhält, wenn die Seite geladen wird.
Online-Beispiel
Lassen Sie das "First name"-Eingabefeld beim Laden der Seite automatisch fokussieren:
<input> form 属性
form 属性规定输入域所属的一个或多个表单。
Hinweis:如需引用一个以上的表单，请使用空格分隔的列表。
Online-Beispiel
位于 form 表单外的 input 字段引用了 HTML form（该 input 表单仍然属于 form 表单的一部分）:
<input> formaction 属性
The formaction 属性用于描述表单提交的 URL 地址。
The formaction 属性会覆盖 <form> 元素中的 action 属性。
Achtung: The formaction 属性用于 type="submit" 和 type="image"。
Online-Beispiel
以下 HTML form 表单包含了两个不同地址的提交按钮：
<input> formenctype 属性
formenctype 属性描述了表单提交到服务器的数据编码（只对 method="post" 的表单）。
formenctype 属性覆盖 form 元素的 enctype 属性。
主要: 该属性与 type="submit" 和 type="image" 配合使用。
Online-Beispiel
第一个提交按钮已默认编码发送表单数据，第二个提交按钮以 "multipart/form-data" 编码格式发送表单数据:
<input> formmethod-Eigenschaft
Die formmethod-Eigenschaft definiert den Einreichungsweg des Formulars.
Die formmethod-Eigenschaft überschreibt die method-Eigenschaft des <form>-Elements.
Achtung: Diese Eigenschaft kann zusammen mit type="submit" und type="image" verwendet werden.
Online-Beispiel
Beispiel zur Neudefinierung des Formular-Einreichungswegs:
<input> formnovalidate-Eigenschaft
Die novalidate-Eigenschaft ist eine boolean-Eigenschaft.
Die novalidate-Eigenschaft beschreibt, dass das <input>-Element bei der Formularübergabe nicht überprüft werden muss.
Die formnovalidate-Eigenschaft überschreibt die novalidate-Eigenschaft des <form>-Elements.
Hinweis: Die formnovalidate-Eigenschaft wird zusammen mit type="submit" verwendet
Online-Beispiel
Eine Formular mit zwei Einreichknöpfen (mit und ohne Validierung):
<input> formtarget-Eigenschaft
Die formtarget-Eigenschaft legt einen Namen oder einen Schlüssel fest, um die Anzeige der nach dem Einreichen der Daten empfangenen Formulardaten zu kennzeichnen.
Die formtarget-Eigenschaft überschreibt die target-Eigenschaft des <form>-Elements.
Achtung: Die formtarget-Eigenschaft wird zusammen mit type="submit" und type="image" verwendet.
Online-Beispiel
Eine Formular mit zwei Einreichknöpfen, die in verschiedenen Fenstern angezeigt werden:
<input> height und width Attribute
Die height- und width-Attribute legen die Höhe und Breite des Bildes für die <input>-Tags des Typs image fest.
Achtung: Die height- und width-Attribute gelten nur für <input>-Tags des Typs image.
Hinweis:Das Bild wird in der Regel sowohl die height- als auch die width-Attribute angegeben. Wenn das Bild Höhe und Breite einstellt, ist der erforderliche Raum
Wird beim Laden der Seite beibehalten. Ohne diese Attribute wird
Der Browser kennt die Größe des Bildes nicht und kann nicht vorausberechnen.
Geeigneter Raum. Während des Ladens kann das Layout der Seite verändert werden.
(obwohl das Bild bereits geladen wurde).
Online-Beispiel
Ein Bildschaltknopf wurde definiert, der die height und width-Attribute verwendet:
<input list-Attribut>
Das list-Attribut legt die datalist für das Eingabefeld fest. Die datalist ist eine Liste von Optionen für das Eingabefeld.
Online-Beispiel
Werte für <input> im Voraus im <datalist> definiert:
min und max-Attribute von <input>
Die min, max und step-Attribute werden verwendet, um Begrenzungen (Beschränkungen) für input-Typen, die Zahlen oder Daten enthalten, festzulegen.
Hinweis: Die min, max und step-Attribute gelten für die folgenden Typen von <input>-Tags: Datumseingabefelder, Number und Range.
Online-Beispiel
<input> 元素最小值与最大值设置:
<input> multiple 属性
multiple 属性是一个 boolean 属性。
multiple 属性规定<input> 元素中可选择多个值。
Achtung: multiple 属性适用于以下类型的 <input> 标签：email 和 file:
Online-Beispiel
上传多个文件:
<input> pattern 属性
pattern 属性描述了一个正则表达式用于验证 <input> 元素的值。
Achtung:pattern 属性适用于以下类型的 <input> 标签: text, search, url, tel, email 和 password。
提示： 是用来全局 title 属性描述了模式。
Online-Beispiel
下面的示例显示了一个只能包含三个字母的文本域（不含数字及特殊字符）：
<input> placeholder-Attribut
Das placeholder-Attribut bietet eine Art Hinweis (Hint), der den erwarteten Wert des Eingabefelds beschreibt.
Kurze Hinweise werden vor der Eingabe des Benutzers im Eingabefeld angezeigt.
Achtung: Das placeholder-Attribut ist für die folgenden Typen des <input>-Elements geeignet: text, search, url, telephone, email und password.
Online-Beispiel
input-Feld-Hinweistext t:
input> required-Attribut
Das required-Attribut ist ein boolean-Attribut.
Das required-Attribut bestimmt, dass das Eingabefeld vor dem Absenden ausgefüllt werden muss (nicht leer).
Achtung:Das required-Attribut ist für die folgenden Typen des <input>-Elements geeignet: text, search, url, telephone, email, password, Datumselektoren, number, checkbox, radio und file.
Online-Beispiel
Das Eingabefeld darf nicht leer sein:
input> step-Attribut
Der step-Attribut legt die erlaubten numerischen Intervalle für das Eingabefeld fest.
wenn step="3wenn " -3,0,3,6 und
Hinweis: Der step-Attribut kann mit
max und min Attribute erstellen einen Bereichswert.
Achtung: Der step-Attribut wird gemeinsam mit den folgenden Typen verwendet: number, range, date, datetime, datetime-local, month, time und week fest.
Online-Beispiel
Legt den Schritt der Eingabe auf3:
HTML5 <input>-Schlagwort
| Schlagwort | Beschreibung |
| <form> | Definieren eines Formulars |
| <input> | Definieren eines Input-Feldes |