Heim > Artikel > Web-Frontend > Was sind die Attribute von HTML5-Formularen?
Wenn Sie eine ausführliche Erklärung der Elemente des Formulars sehen möchten, sehen Sie sich bitte hier die ausführliche Erklärung der HTML5-Formularelemente an
Wir haben oben über die Elemente des Formulars gesprochen, jetzt wollen wir Schauen Sie sich einige der neuen Attribute an
Wenn Sie diesen Link noch nicht gesehen haben: Ausführliche Erklärung der HTML5-Formularelemente
Die neuen Formularattribute von HTML5 betreffen hauptsächlich zwei Aspekte: die neuen Attribute von das ff9c23ada1bcecdd1a0fb5d5a0f18437d5fd7aea971a85678ba271703566ebfd-Element.
HTML5-Formularattribute
Neue Formularattribute:
Autovervollständigung
novavalidate
Neues Eingabeattribut:
Autovervollständigung
Autofokus
form
form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)
height und Breite
Liste
Min, Max und Schritt
Mehrfach
Muster(regexp)
Platzhalter
erforderlich
Autovervollständigungsattribut
Das Autovervollständigungsattribut gibt an, dass das Formular oder Eingabefeld über eine Autovervollständigungsfunktion verfügen soll.
Hinweis: Die automatische Vervollständigung gilt für ff9c23ada1bcecdd1a0fb5d5a0f18437-Tags sowie für die folgenden Arten von d5fd7aea971a85678ba271703566ebfd-Tags: Text, Suche, URL, Telefon, E-Mail, Passwort, Datumsauswahl, Bereich und Farbe.
Wenn der Benutzer mit der Eingabe in das Autovervollständigungsfeld beginnt, sollte der Browser die Optionen zum Ausfüllen in diesem Feld anzeigen:
<form action="demo_form.asp" method="get" 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>
Hinweis: In einigen Browsern müssen Sie möglicherweise die Autovervollständigung aktivieren, um die Funktion abzuschließen Aktivieren Sie diese Eigenschaft.
Autofokus-Attribut
Das Autofokus-Attribut gibt an, dass ein Feld automatisch den Fokus erhält, wenn die Seite geladen wird.
Hinweis: Das Autofokus-Attribut gilt für alle 11d42fe3f0aa1bebfae42abcf1df3bc1-Tags: Submit und Image.
<form action="demo_form.asp" method="get" id="user_form"> E-mail: <input type="email" name="userid" /><br /> <input type="submit" value="Submit" /> <br /> <input type="submit" formaction="demo_admin.asp" value="Submit as admin" /> <br /> <input type="submit" formnovalidate="true" value="Submit without validation" /> <br /> </form>
Hinweis: Diese Eigenschaften sind nützlich zum Erstellen verschiedener Senden-Schaltflächen.
Höhe- und Breitenattribute
Höhe- und Breitenattribute geben die Bildhöhe und -breite an, die für Eingabe-Tags vom Typ Bild verwendet werden.
Hinweis: Die Attribute height und width gelten nur für d5fd7aea971a85678ba271703566ebfd-Tags.
<input type="image" src="img_submit.gif" width="99" height="99" />
Listenattribut
Listenattribut gibt die Datenliste des Eingabefelds an. datalist ist eine Liste von Optionen für das Eingabefeld.
Hinweis: Das Listenattribut gilt für die folgenden Arten von 7a7276301a860ea402f6bdc1f67f4471-Tags: Text, Suche, URL, Telefon, E-Mail, Datumsauswahl, Nummer, Bereich und Farbe.
Webpage: <input type="url" list="url_list" name="link" /> <datalist id="url_list"> <option label="W3Schools" value="http://www.w3school.com.cn" /> <option label="Google" value="http://www.google.com" /> <option label="Microsoft" value="http://www.microsoft.com" /> </datalist>
Min-, Max- und Schrittattribute
Die Min-, Max- und Schrittattribute werden verwendet, um Grenzwerte (Einschränkungen) für Eingabetypen anzugeben, die Zahlen oder Datumsangaben enthalten. Das Attribut
max gibt den maximal zulässigen Wert für das Eingabefeld an. Das Attribut
min gibt den minimal zulässigen Wert für das Eingabefeld an.
Das Schrittattribut gibt die zulässigen Zahlenintervalle für das Eingabefeld an (wenn step="3" sind die zulässigen Zahlen -3,0,3,6 usw.).
Hinweis: Die Attribute „Min“, „Max“ und „Schritt“ gelten für die folgenden Arten von 7a7276301a860ea402f6bdc1f67f4471-Tags: Datumsauswahl, Zahl und Bereich.
Das folgende Beispiel zeigt ein numerisches Feld, das Werte zwischen 0 und 10 in 3er-Schritten akzeptiert (d. h. zulässige Werte sind 0, 3, 6 und 9):
Points: <input type="number" name="points" min="0" max="10" step="3" />
Mehrfachattribut
Mehrfachattribut gibt an, dass im Eingabefeld mehrere Werte ausgewählt werden können.
Hinweis: Das Mehrfachattribut gilt für die folgenden Arten von 7a7276301a860ea402f6bdc1f67f4471-Tags: E-Mail und Datei.
Select images: <input type="file" name="img" multiple="multiple" />
novalidate-Attribut
Das novalidate-Attribut gibt an, dass Formular- oder Eingabefelder beim Absenden eines Formulars nicht validiert werden sollen.
Hinweis: Das novalidate-Attribut gilt für ff9c23ada1bcecdd1a0fb5d5a0f18437 und die folgenden Arten von d5fd7aea971a85678ba271703566ebfd-Tags: Text, Suche, URL, Telefon, E-Mail, Passwort, Datumsauswahl, Bereich und Farbe.
<form action="demo_form.asp" method="get" novalidate="true"> E-mail: <input type="email" name="user_email" /> <input type="submit" /> </form>
Musterattribut
Das Musterattribut gibt das Muster (Muster) an, das zur Überprüfung des Eingabefelds verwendet wird.
Muster ist ein regulärer Ausdruck. In unserem JavaScript-Tutorial erfahren Sie mehr über reguläre Ausdrücke.
Hinweis: Das Musterattribut gilt für die folgenden Arten von 7a7276301a860ea402f6bdc1f67f4471-Tags: Text, Suche, URL, Telefon, E-Mail und Passwort.
Das folgende Beispiel zeigt ein Textfeld, das nur drei Buchstaben enthalten kann (ohne Zahlen und Sonderzeichen):
Country code: <input type="text" name="country_code" pattern="[A-z]{3}" title="Three letter country code" />
Platzhalterattribut
placeholder 属性提供一种提示(hint),描述输入域所期待的值。
注:placeholder 属性适用于以下类型的 d5fd7aea971a85678ba271703566ebfd 标签:text, search, url, telephone, email 以及 password。
提示(hint)会在输入域为空时显示出现,会在输入域获得焦点时消失:
<input type="search" name="user_search" placeholder="Search php" />
required 属性
required 属性规定必须在提交之前填写输入域(不能为空)。
注:required 属性适用于以下类型的 d5fd7aea971a85678ba271703566ebfd 标签:text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。
Name: <input type="text" name="usr_name" required="required" />
【相关推荐】
Das obige ist der detaillierte Inhalt vonWas sind die Attribute von HTML5-Formularen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!