Heim >Web-Frontend >H5-Tutorial >Fassen Sie die Verwendung neuer Formularelemente in HTML5 und praktische Tutorials zusammen

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

零下一度
零下一度Original
2017-05-16 11:53:401858Durchsuche

HTML5 neue Formularelemente

HTML5 hat die folgenden neuen Formularelemente:

fc86e7b705049fc9d4fccc89a2e80ee3

aa983b9eb8086376f1f6481364a02e5a

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 fc86e7b705049fc9d4fccc89a2e80ee3-Element Das

fc86e7b705049fc9d4fccc89a2e80ee3-Element gibt eine Liste von Optionen für ein Eingabefeld an. Das Attribut

fc86e7b705049fc9d4fccc89a2e80ee3 gibt an, dass das Formular oder Eingabefeld über eine Funktion zur automatischen Vervollständigung verfügen soll. Wenn der Benutzer mit der Eingabe in ein Autovervollständigungsfeld beginnt, sollte der Browser die ausgefüllten Optionen in diesem Feld anzeigen:

Binden Sie das fc86e7b705049fc9d4fccc89a2e80ee3-Element mithilfe des Listenattributs des d5fd7aea971a85678ba271703566ebfd >

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 aa983b9eb8086376f1f6481364a02e5a Der Zweck des

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

aa983b9eb8086376f1f6481364a02e5a 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 be6d67dae90cc1ad6469079e163d0939-Element

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

Instanz

zeigt die Berechnungsergebnisse im be6d67dae90cc1ad6469079e163d0939 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

fc86e7b705049fc9d4fccc89a2e80ee3: Das d5fd7aea971a85678ba271703566ebfd-Tag definiert eine Liste von Optionen. Verwenden Sie dieses Element in Verbindung mit einem Eingabeelement, um die möglichen Werte der Eingabe zu definieren.

aa983b9eb8086376f1f6481364a02e5a: Das aa983b9eb8086376f1f6481364a02e5a-Tag gibt das für das Formular verwendete Schlüsselpaargeneratorfeld an.

be6d67dae90cc1ad6469079e163d0939: Das be6d67dae90cc1ad6469079e163d0939-Tag definiert verschiedene Arten der Ausgabe, wie z. B. die Skriptausgabe.

【Verwandte Empfehlungen】


1.

Besondere Empfehlung: Version „php Programmer Toolbox“ V0.1 herunterladen

2.

Kostenloses h5-Online-Video-Tutorial

3.

php.cn Original-HTML5-Video-Tutorial

Das obige ist der detaillierte Inhalt vonFassen Sie die Verwendung neuer Formularelemente in HTML5 und praktische Tutorials zusammen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn