Was sind die Attribute des HTML-Eingabe-Tags? Zusammenfassung der Verwendung des Eingabe-Tags (mit Beispielen)

Dieser Artikel stellt Ihnen hauptsächlich die Attribute des HTML-Eingabe-Tags vor und gibt eine Zusammenfassung der spezifischen Verwendung des HTML-Eingabe-Tags. Werfen wir einen Blick auf die Verwendung des HTML-Eingabe-Tags

Lassen Sie uns zunächst über die Attribute des HTML-Eingabe-Tags sprechen:

1.Typ: Dies attribute is input Das einzige Attribut im Tag, das eingegeben werden muss. Natürlich kann es leer gelassen werden. Der Standardwert ist type = „text“. Die spezifischen Werte werden später besprochen.

2.erforderlich: Markieren Sie, ob ein Feld erforderlich ist. Wenn ein Feld als erforderlich = „erforderlich“ (im strikten Modus) oder erforderlich (im entspannten Modus) markiert ist (ps: Die folgenden Attribute werden auf die gleiche Weise geschrieben, sodass sie nicht einzeln ausgeschrieben werden) und das Wenn der Wert dieses Felds leer ist oder der eingegebene Wert ungültig ist, kann das Formular nicht gesendet werden. Was ist ein ungültiger Wert? Schauen Sie sich das Musterattribut an.

3.Muster: Dieses Attribut enthält einen regulären Ausdruck im JavaScript-Stil. Der Eingabeinhalt muss vollständig mit dem regulären Ausdruck übereinstimmen, andernfalls ist der Eingabeinhalt ungültig. Sie wissen nichts über reguläre Ausdrücke? Sie können einen Blick auf reguläre JavaScript-Ausdrücke werfen.

4.min max: Diese beiden Attribute werden für Datum, Uhrzeit, Uhrzeit und andere Eingaben sowie Zahl und Bereich verwendet. Wie der Name schon sagt, besteht ihre Aufgabe darin, die Maximal- und Minimalwerte zu begrenzen.

5.step: Ähnlich wie bei max min besteht die Funktion darin, eine Schaltfläche bereitzustellen, die nach oben und unten angeklickt werden kann. Die aktuelle Zahl ist beispielsweise 1, und Sie stellen Schritt = „5“ ein Aufwärts-Taste und es wird 6. .

6. Zu diesem Attribut gibt es nicht viel zu sagen. Es wird im Allgemeinen verwendet, um den Benutzer zur Eingabe aufzufordern den eingegebenen Text.

7.readonly: Wie der Name schon sagt, macht diese Eigenschaft das leere Formularsteuerelement nicht bearbeitbar. Die Nichtbearbeitbarkeit bedeutet hier nicht, dass es deaktiviert ist, sondern dass der Text nicht bearbeitet werden kann. Beispielsweise sind Optionsfelder und Kontrollkästchen von Natur aus nicht bearbeitbar, sodass dieses Attribut für sie bedeutungslos ist.

8.disabled: Dieses Attribut deaktiviert ein Formularelement. Dies ist deaktiviert, wodurch alle Formularelemente außer

vollständig deaktiviert werden.

9.maxlength: Dieses Attribut wird verwendet, um die maximale Anzahl der vom Benutzer eingegebenen Wörter zu begrenzen.

10.size: Die Steuerung der Größe wird jetzt fast ausschließlich über CSS gesteuert.

11.form: In HTML5 ist es nicht erforderlich, Formularsteuerelemente in einem Formular zu verschachteln. Das neue Formularattribut kann Formularelemente mit jedem Formular auf der Seite verknüpfen. Es kann auch in einem Formular verschachtelt und mit einem anderen Formular übermittelt werden. Der Code lautet wie folgt:

<form id="form1"></form>
<p>
<label for="admin">admin</label>
<input type="text" id="admin" form="form1"/>
</p>

Auf diese Weise werden Formular und Eingabe verbunden. Wenn die Eingabe kein Formularattribut hat, wird sie dem Formular zugeordnet, das ihr am nächsten liegt.

12.Autovervollständigung: Wie der Name schon sagt, gibt der Benutzer bei der automatischen Vervollständigung einen Teil der Eingabe ein und der Rest wird automatisch vervollständigt. Der Browser muss den vom Benutzer eingegebenen Inhalt speichern, damit er beim nächsten Mal automatisch vervollständigt werden kann.

13.Autofokus: Dieses Attribut bedeutet, dass dieses Formularsteuerelement automatisch den Fokus erhält, wenn die Seite geladen wird.

Das Obige sind die Attribute des HTML-Eingabe-Tags. (Wenn Sie mehr sehen möchten, besuchen Sie die chinesische PHP-Website. Hier ist das umfassendste HTML-Video-Tutorial)

Lassen Sie uns nun über die Verwendung von Eingabe-Tags sprechen:

Sehen Sie sich zunächst ein Beispiel für ein HTML-Eingabe-Tag an:

<form action="demo_form.asp">
用户名: <input type="text" name="fname"><br>
输入框: <input type="text" name="lname"><br>
<input type="submit" value="提交">
</form>

Der Effekt ist wie in der Abbildung dargestellt:

Der Effekt ist immer noch in Ordnung. Es ist auch der einfachste Eingabefeldstil. Was wir heute sprechen, wird auch einfach sein.

Lassen Sie uns über die Verwendungszusammenfassung des HTML-Eingabe-Tags sprechen:

1 Textfeld:

Im Formular: Mithilfe von Textfeldern können Benutzer Buchstaben, Zahlen usw. eingeben, beispielsweise den Namen, die Adresse usw. des Benutzers.

Das Codeformat ist wie folgt:

<input type=”text” name=”...” size=”...” maxlength=”...” value=”...”/>

2. Passwortfeld:

ist ein spezielles Textfeld zur Eingabe von Passwörtern.

Das Codeformat ist wie folgt:

<input type=”password” name=”...”  size=”...” maxlength=”...” value=”...”/>

3. Versteckte Domäne:

ist ein unsichtbares Element, das zum Sammeln oder Senden von Informationen für das Web verwendet wird Seitenzugriff Für den Benutzer ist die versteckte Domain unsichtbar. Wenn das Formular gesendet wird, sendet das ausgeblendete Feld Informationen mit dem Namen und Wert, den Sie beim Einrichten definiert haben, an den Server.

Das Codeformat ist wie folgt:

<input type=”hidden” name=”...” value=”...”/>

4. Optionsfeld:

Verwenden Sie das Optionsfeld, wenn der Benutzer eines aus a auswählen soll Schaltfläche „Begrenzte Anzahl an Optionen“. Beispielsweise wählen wir bei der Anmeldung unser Gewicht aus.

Das Codeformat ist wie folgt:

<input type=”radio” name=”...” value=”...”/>

5. Kontrollkästchen:

Ermöglicht die Auswahl mehrerer Optionen. Jedes Kontrollkästchen ist ein unabhängiges Element und muss einen eindeutigen Namen haben.

Das Codeformat ist wie folgt:

<input type=”checkbox” name=”...” value=”...”/>

6. Datei-Upload-Feld:

Das Codeformat ist wie folgt:

<input type”file” name=”...”>

Hinweis: Geben Sie bei der Auswahl einer Funktion das Methodenattribut im Formular-Tag an. Um die Methode als Post anzugeben, wird das enctype-Attribut als multipart/form-data angegeben.

Beschreibung: Ob das Multipart-Steuerelement mehrere Dateien hochlädt

Das Obige ist eine Einführung in die Attribute des HTML-Eingabe-Tags in diesem Artikel sowie eine Zusammenfassung der Verwendung des HTML-Eingabe-Tags. Wenn Sie Fragen haben, können Sie unten eine Nachricht hinterlassen.

[Empfehlung der Redaktion]

Wie erstelle ich ein HTML-Dropdown-Menü? Einführung in das Codebeispiel des HTML-Dropdown-Menüs

Was ist der Unterschied zwischen B-Tag und Strong-Tag in HTML? Zusammenfassung des Unterschieds zwischen b und strong

Das obige ist der detaillierte Inhalt vonWas sind die Attribute des HTML-Eingabe-Tags? Zusammenfassung der Verwendung des Eingabe-Tags (mit Beispielen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!