Heim >Web-Frontend >HTML-Tutorial >Verwendung von HTML-Formular-Tags

Verwendung von HTML-Formular-Tags

小云云
小云云Original
2018-01-26 11:19:406958Durchsuche

Im Allgemeinen wird das d5fd7aea971a85678ba271703566ebfd-Tag in Formularen verwendet, um Benutzereingabeinformationen zu sammeln. Das am häufigsten verwendete Formular-Tag ist das Eingabe-Tag (d5fd7aea971a85678ba271703566ebfd). Eingabetypen werden durch das Typattribut (Typ) definiert. Zu den gängigen Eingabetypen gehören Textfelder, Optionsfelder, Kontrollkästchen, Dropdown-Menüs usw.

Formulare in HTML können zum Sammeln verschiedener Arten von Benutzereingabeinformationen verwendet werden. Ein Formular ist eigentlich ein Bereich, der Formularelemente enthält. Die Eingabeinformationen verschiedener Elemente in diesem Bereich werden schließlich über das Formular an das Programmskript übermittelt. Zu den häufigsten gehören beispielsweise Benutzeranmeldung, Registrierung, Veröffentlichung von Artikeln usw., die alle an dynamische Programme zur Verarbeitung über Formulare übermittelt werden. In diesem Abschnitt geht es hauptsächlich um Formulare und Formularelemente. Wie Formularinformationen an dynamische Programme übermittelt werden, wird in zukünftigen Programmiersprachenlektionen besprochen.
Der Bereich des Formulars verwendet das Tag ff9c23ada1bcecdd1a0fb5d5a0f18437, um den Umfang des Formulars zu definieren. Die Werte der Elemente in ff9c23ada1bcecdd1a0fb5d5a0f18437f5a47148e367a6035fd7a2faa965022e dieses Formular.
Textfeld
Das Textfeld bietet Benutzern die Möglichkeit, Text einzugeben. Der Browser interpretiert das Textfeld als rechteckiges Feld. Der Benutzer bewegt den Cursor auf das Feld und klickt darauf Der Cursor kann in den Rahmen bewegt werden. Benutzer können Buchstaben, Zahlen usw. in das Formular eingeben.
Das Textfeld wird durch Festlegen des Textwerts für das Typattribut im d5fd7aea971a85678ba271703566ebfd-Tag


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. d4b4b6153ae55cb7ed4cafbfe50eeefb

  2. Textfeld 1:

    65d8c88bbd171e04c76806e3ce92fe8c

  3. Textfeld 2:

    5c9c79a852a46b4df1567bfecebb3824

  4. form> ;

Der Browser zeigt wie folgt an:


201678135308382.png (296×89)

Radio-Button
Radio-Button in den meisten Fällen Erscheint in den Optionen für Benutzer zur Eingabe von Informationen bei der Registrierung. Bei dieser Art von Mehrbenutzermodus können Benutzer nur ein Ergebnis auswählen.
Das Optionsfeld wird definiert, indem der Wert des Typattributs im d5fd7aea971a85678ba271703566ebfd-Tag auf radio gesetzt wird.

  1. <form>
    <input type=”radio” name=”sex” value=”male” /> 男生   
    <input type=”radio” name=”sex” value=”female” /> 女生   
    </form>
Die Anzeige im Browser ist:


201678135342504.png (164×77)

Kontrollkästchen
Mithilfe von Kontrollkästchen können Benutzer bestimmte entsprechende Optionen oder Optionen markieren. Eine häufige Möglichkeit besteht darin, Benutzern Funktionen bereitzustellen, z. B. das Merken ihres Anmeldekontos beim Anmelden. Auf der Benutzerumfrageseite können Sie auch mehrere Meinungen von Benutzern einholen. Das Kontrollkästchen
wird definiert, indem der Wert des Typattributs im Tag d5fd7aea971a85678ba271703566ebfd auf checkbox

  1. <form>
    <input type=”checkbox” name=”val1″ />
    前端开拓者不错   
    <input type=”checkbox” name=”val2″ />
    前端开拓者一般   
    </form>
  2. gesetzt wird folgt:


201678135409883.png (203×92)

Dropdown-Menü

Das Dropdown-Menü ähnelt der Radioauswahl bei der Informationsauswahl, das Dropdown-Menü kann jedoch angepasst werden Weitere Informationen. Und das Dropdown-Menü kann nach Auswahl des Menüwerts zusätzliche Skripte ausführen.
Das Dropdown-Menü beginnt mit 221f08282418e2996498697df914ce4e, und jedes Options-Tag im Select-Tag ist ein Wert im Dropdown-Menü.

  1. <form>
    <select name=”cars”>
    <option value=”volvo”>Volvo</option>
    <option value=”saab”>Saab</option>
    <option value=”fiat”>Fiat</option>
    <option value=”audi”>Audi</option>
    </select>
    </form>
  2. Der Browser zeigt an:


201678135442039.png (149×83)

Senden-Schaltfläche

Senden-Schaltfläche ist ein notwendiger Bestandteil jeder Form. Nachdem der Benutzer die entsprechenden Informationen eingegeben hat, muss er auf die Schaltfläche „Senden“ klicken, um die Aktion auszulösen und die Formularwerte an die nächste Seite zu senden. Wenn das Aktionsattribut im ff9c23ada1bcecdd1a0fb5d5a0f18437-Tag die entsprechende Übermittlungsadresse festlegt, werden mit der Schaltfläche „Senden“ alle im Formular erhaltenen Daten an diese Adresse an die Seite gesendet.
Die Schaltfläche „Senden“ wird definiert, indem der Wert des zu sendenden Typs im Eingabe-Tag festgelegt wird. Das Folgende ist ein Beispiel für das Suchfeld des Front-End-Entwicklers, bei dem die Übermittlungsadresse als Suchseite festgelegt wird.

  1. <form name=”input” action=”http://www.frontopen.com/” method=”get”>
    关键字:   
    <input type=”text” name=”s” id=”s” />
    <input type=”submit” value=”搜索” />
    </form>
  2. Der Browser zeigt Folgendes an:


Fazit: Dieser Abschnitt bietet nur eine grundlegende Demonstration und Erklärung häufig verwendeter Formular-Frontend-Layoutelemente. Realform-Anwendungen werden meist in Server-Programmiersprachen verwendet, und es müssen mehr Parameter und Regeln festgelegt werden. In dieser Lektion müssen Sie nur verstehen, wie die Elemente des Formulars angeordnet werden. In den meisten Fällen können Sie grundsätzlich mit dem Hintergrundprogrammierer zusammenarbeiten, um die Website-Entwicklung abzuschließen.

Verwandte Empfehlungen:

Detaillierte Erläuterung der HTML-Formularelemente

JQuery-Formularüberprüfung, ob das Optionsfeld ausgewählt ist. Erfahrungszusammenfassung

Das WeChat-Applet implementiert einfach das Formular, um Eingabedaten zu erhalten, und teilt Beispiele

Das obige ist der detaillierte Inhalt vonVerwendung von HTML-Formular-Tags. 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