Was sind die Attribute des Eingabe-Tags in HTML?

醉折花枝作酒筹
Freigeben: 2021-06-04 10:11:14
Original
8191 Leute haben es durchsucht

Die Attribute des Eingabe-Tags in HTML sind: Typ, erforderlich, Muster, Schritt, Platzhalter, schreibgeschützt, deaktiviert, Größe, Form, maximale Länge, Autofokus, Min., Max. usw.

Was sind die Attribute des Eingabe-Tags in HTML?

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

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

1.Typ: Dieses Attribut ist das einzige Attribut, das im Eingabe-Tag eingegeben werden muss. Natürlich kann es auch leer gelassen werden ist Typ = „Text“. Die spezifischen Werte werden später besprochen.

2.erforderlich: Markieren Sie, ob ein Feld erforderlich ist. Wenn ein Feld als erforderlich = „erforderlich“ (im strengen 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.

Erstellen Sie eine Full-Network-Web-Front-End-Full-Stack-Datenbank (allgemeines Verzeichnis), um schneller zu lernen und einen besseren Überblick zu haben. Sie haben es verdient (kontinuierlich aktualisiert)

3.Muster: Dieses Attribut enthält einen regulären Ausdruck im JavaScript-Stil In der Formel muss der Eingabeinhalt 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 Eingaben wie Datum und Uhrzeit sowie Anzahl 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 geklickt werden kann. Die aktuelle Zahl ist beispielsweise 1, und Sie legen Schritt = „5“ fest wird 6.

6.Platzhalter: Zu diesem Attribut gibt es nicht viel zu sagen. Es wird im Allgemeinen verwendet, um den Benutzer zur Eingabe aufzufordern. Wenn der Benutzer tatsächlich Text eingibt, wird dieser durch den eingegebenen Text überschrieben.

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 müssen Formularsteuerelemente nicht in einem Formular verschachtelt werden. 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">
<p>
<label for="admin">admin</label>
<input type="text" id="admin" form="form1"/>
</p>
</form>
Nach dem Login kopieren

Auf diese Weise werden Formular und Eingabe miteinander 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.autofocus: 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.

Erweiterte Informationen

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

Schauen Sie sich zunächst ein Beispiel des HTML-Eingabe-Tags an:

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

Der Effekt davon ist wie im Bild dargestellt:

Der Effekt ist immer noch in Ordnung, was auch der einfachste Eingabefeldstil ist. Was wir heute besprechen werden, ist auch einfach zu verstehen.

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

1. Textfeld:

Im Formular wird das Textfeld verwendet, um dem Benutzer die Eingabe von Buchstaben, Zahlen usw. zu ermöglichen, z der Name, die Adresse usw. des Benutzers.

Das Codeformat ist wie folgt:

<input type=”text” name=”...” size=”...” maxlength=”...” value=”...”/>
Nach dem Login kopieren

2. Passwortfeld:

ist ein spezielles Textfeld zur Eingabe von Passwörtern.

Das Codeformat ist wie folgt:

<input type=”password” name=”...”  size=”...” maxlength=”...” value=”...”/>
Nach dem Login kopieren

3. Versteckte Felder:

sind unsichtbare Elemente, die zum Sammeln oder Senden von Informationen verwendet werden und für Besucher der Webseite unsichtbar sind. 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=”...”/>
Nach dem Login kopieren

4. Optionsfelder:

Verwenden Sie Optionsfelder, wenn der Benutzer eine aus einer begrenzten Anzahl von Optionen auswählen muss. Beispielsweise wählen wir bei der Anmeldung unser Gewicht aus.

Das Codeformat ist wie folgt:

<input type=”radio” name=”...” value=”...”/>
Nach dem Login kopieren

5. Kontrollkästchen:

Ermöglicht die Auswahl mehrerer Optionen unter den auszuwählenden 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=”...”/>
Nach dem Login kopieren

6. Datei-Upload-Feld:

Das Codeformat ist wie folgt:

<input type”file” name=”...”>
Nach dem Login kopieren

注意:利用这项功能时,在 form 标签中要指定method属性。要把method 指定为post, enctype属性指定为 multipart/form-data。

说明:multipart 控件是否上传多文件

推荐学习:html视频教程

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

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage