Fassen Sie die Verwendung neuer Formularelemente in HTML5 und praktische Tutorials zusammen

HTML5 neue Formularelemente

HTML5 hat die folgenden neuen Formularelemente:

Hinweis: Nicht alle Browser unterstützen die neuen HTML5-Formularelemente, Sie können sie jedoch verwenden. Auch wenn der Browser keine Formularattribute unterstützt, kann es dennoch als reguläres Formularelement angezeigt werden.

HTML5

Binden Sie das

Beispiel

<input> 元素使用<datalist>预定义值:
<input list="browsers"><datalist id="browsers">  <option value="Internet Explorer">  <option value="Firefox">  <option value="Chrome">  <option value="Opera">  <option value="Safari"></datalist>

HTML5 Der Zweck des

-Elements besteht darin, eine zuverlässige Möglichkeit zur Authentifizierung des Benutzers bereitzustellen. Das Tag

gibt das Schlüsselpaar-Feld

Generator an, das im Formular verwendet werden soll.

Beim Absenden des Formulars werden zwei Schlüssel generiert, einer ist der private Schlüssel und der andere ist der öffentliche Schlüssel.

Der private Schlüssel wird auf dem Client gespeichert und der öffentliche Schlüssel wird an den Server gesendet. Der öffentliche Schlüssel kann verwendet werden, um später das Client-Zertifikat des Benutzers zu überprüfen (Client-Zertifikat

ificate).

Beispiel

Formular mit Keygen-Feld:

<form action="demo_keygen.asp" method="get">用户名: <input type="text" name="usr_name">加密: <keygen name="security"><input type="submit"></form>

HTML5

-Element

-Element wird für verschiedene Arten von Ausgaben verwendet , wie z. B. Berechnung oder Skriptausgabe:

Instanz

zeigt die Berechnungsergebnisse im

an:

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0<input type="range" id="a" value="50">100 +<input type="number" id="b" value="50">=<output name="x" for="a b"></output></form>

HTML5 neues Formularelement