Was sind die neuen Formularattribute in HTML5?

HTML5 Zu den neuen Formularattributen gehören: Autovervollständigung, Novalidate, Autofokus, Form, Formaction, Formmethod, Formnovalidate, Formtarget, Liste, Min., Max., Schritt usw.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, HTML5-Version, Dell G3-Computer.

HTML5 neue Formularattribute

HTML5s

-Tags haben mehrere neue Attribute hinzugefügt

Neue Attribute:

• novalidate

• Neue Attribute:

Autovervollständigung: Automatische Vervollständigung, ob zuvor übermittelte Daten für den nächsten Eingabevorschlag automatisch aufgezeichnet werden sollen.

• Autofokus: Eingabefokus automatisch erhalten.

• form: Der Wert ist die ID eines Formulars. Wenn festgelegt, kann das Eingabefeld außerhalb des Formulars platziert werden.

• formaction: URL-Adresse, die zur Beschreibung der Formularübermittlung verwendet wird

• formenctype: Beschreibt die Datenkodierung der Formularübermittlung an den Server (nur für method="post"-Formulare in Formularformularen)

• formmethod: definiert wie Das Formular wird abgesendet.

• formnovalidate: Beschreibt, dass das -Element beim Absenden des Formulars nicht validiert werden muss.

• formtarget: Geben Sie einen Namen oder ein Schlüsselwort an, um die Anzeige nach dem Empfang der Formularübermittlungsdaten anzugeben.

• Höhe und Breite: Geben Sie die Bildhöhe und -breite an, die für -Tags verwendet werden.

• Liste: Gibt die Datenliste des Eingabefelds an. datalist ist eine Liste von Optionen für das Eingabefeld.

• min und max: Begrenzen Sie den minimalen oder maximalen Wert der Eingabezahl.

• multiple: Gibt an, ob mehrere Eingabewerte zulässig sind. Wenn dieses Attribut deklariert ist, können mehrere durch Kommas getrennte Werte eingegeben werden im Eingabefeld.

• pattern (regexp): Geben Sie einen regulären Ausdruck an, um die Eingabe zu validieren. (Standardmäßig wird ^$ am Anfang und am Ende hinzugefügt)

• Platzhalter: Platzhalter, der zum Anzeigen von Eingabeaufforderungstext im Eingabefeld verwendet wird. Im Gegensatz zum Wert kann er nicht übermittelt werden.

• erforderlich: Beim Absenden des Formulars wird überprüft, ob eine Eingabe erfolgt. Andernfalls wird eine Eingabeaufforderung angezeigt.

• Schritt: Begrenzen Sie die Schrittgröße der Eingabezahlen, verwendet in Verbindung mit min.

• maxlength: Begrenzen Sie die maximale Länge. Dies ist nur nützlich, wenn eine Eingabe erfolgt. Es wird nicht zwischen Chinesisch und Englisch unterschieden.

• minlength: begrenzt die Mindestlänge, ist jedoch kein H5-Standardattribut und wird nur von einigen Browsern unterstützt.

novalidate-Attribut

Das novalidate-Attribut ist ein boolesches (boolesches) Attribut, das angibt, dass das Formular oder Eingabefeld beim Absenden des Formulars nicht validiert werden soll.

Beispiel:

Übermittelte Formulardaten müssen nicht validiert werden

<form action="demo-form.php" novalidate>
  E-mail: <input type="email" name="user_email">
  <input type="submit"></form>

oder Wenn der Benutzer mit der Eingabe in das Autovervollständigungsfeld beginnt, sollte der Browser die ausgefüllten Optionen im Feld anzeigen.

Tipps: Das Autocomplete-Attribut kann im Formularelement aktiviert, im Eingabeelement jedoch deaktiviert sein. Hinweis: Die automatische Vervollständigung funktioniert mit -Tags sowie den folgenden Arten von -Tags: Text, Suche, URL, Telefon, E-Mail, Passwort, Datumsauswahl, Bereich und Farbe.

Beispiel: Aktivieren Sie die automatische Vervollständigung in

form (schalten Sie die automatische Vervollständigung für ein Eingabefeld aus):

<form action="demo-form.php" autocomplete="on">
  First name:<input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  E-mail: <input type="email" name="email" autocomplete="off"><br>
  <input type="submit">
</form>

Tipps: In einigen Browsern müssen Sie möglicherweise die Funktion zur automatischen Vervollständigung aktivieren, damit dieses Attribut wirksam wird.

novalidate-Attribut

Das novalidate-Attribut ist ein boolesches Attribut, das angibt, dass das Formular oder Eingabefeld beim Absenden des Formulars nicht validiert werden soll.

Beispiel: Keine Notwendigkeit, übermittelte Formulardaten zu überprüfen

<form action="demo-form.php" novalidate>
  E-mail: <input type="email" name="user_email">
  <input type="submit">
</form>

formaction-Attribut

Das formaction-Attribut wird verwendet, um die URL-Adresse der Formularübermittlung zu beschreiben.

Das formaction-Attribut überschreibt das -Element Das Aktionsattribut.

Hinweis: Das formaction-Attribut wird für type="submit" und type="image" verwendet.

Beispiel: Das folgende HTMLform-Formular enthält zwei Senden-Schaltflächen mit unterschiedlichen Adressen:

<form action="demo-form.php">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="提交"><br>
  <input type="submit" formaction="demo-admin.php"
  value="提交">
</form>

Das formenctype-Attribut beschreibt die Datenkodierung des an den Server übermittelten Formulars (nur für method="post"-Formulare in Formularformularen)

formenctype-Attribut überschreibt das enctype-Attribut des Formularelements.

Hauptsächlich: Dieses Attribut wird mit type="submit" und type="image" verwendet.

Beispiel: Die erste Senden-Schaltfläche sendet Formulardaten mit Standardcodierung, und die zweite Senden-Schaltfläche sendet Formulardaten mit „multipart/form-data“-Codierung:

<form action="demo-post_enctype.php" method="post">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="提交">
  <input type="submit" formenctype="multipart/form-data"
  value="以 Multipart/form-data 提交">
</form>

formmethod 属性

formmethod 属性定义了表单提交的方式。

formmethod 属性覆盖了

元素的 method 属性。

注意: 该属性可以与 type="submit" 和 type="image" 配合使用。

示例：重新定义表单提交方式实例:

<form action="demo-form.php" method="get">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="提交">
  <input type="submit" formmethod="post" formaction="demo-post.php"
  value="使用 POST 提交">
</form>

formnovalidate 属性

novalidate 属性是一个 boolean 属性.

novalidate属性描述了 元素在表单提交时无需被验证。

formnovalidate 属性会覆盖

元素的novalidate属性.

注意: formnovalidate 属性与type="submit一起使用

示例：

两个提交按钮的表单(使用与不适用验证 ):

<form action="demo-form.php">
  E-mail: <input type="email" name="userid"><br>
  <input type="submit" value="提交"><br>
  <input type="submit" formnovalidate value="不验证提交">
</form>

【推荐课程：HTML5视频教程、web前端入门教程】

Das obige ist der detaillierte Inhalt vonWas sind die neuen Formularattribute in HTML5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!