So erstellen Sie eine Drop-Down-Liste in einem HTML5-Formular

Dropdown-Listen sind ein gemeinsames Merkmal in Web-Seiten und HTML5 macht sie ziemlich narrensicher zu schaffen. Dropdown-Listen können Sie, der Programmierer, eine Reihe von Möglichkeiten, um anzugeben, dass die Besucher auf Ihre Website, ohne die Eingabe zu machen (eine Liste ist in der Abbildung dargestellt). Dropdown-Listen sind besonders schön, weil sie nicht viel Bildschirmfläche benötigen - die Optionen sind nur sichtbar, während der Benutzer sie auswählt.

bild0.jpg

Dropdown-Listen haben eine unglaublich wertvolle Attribut, dass sie bestimmte Arten von Fehlern zu verhindern. Die begrenzten Möglichkeiten machen die Reaktion sehr vorhersehbar, weil Sie alle möglichen Antworten vorherzubestimmen. Sie müssen nicht mit all den verrückten Dingen beschäftigen Benutzer in ein Textfeld eingeben kann.

In HTML5 / XHTML, Dropdown-Listen werden von zwei Arten von Objekten erstellt. Die Gesamtstruktur verwendet die Tags, während jede der möglichen Entscheidungen seiner eigenen Tag hat, wie der Code für eine Web-Seite mit einem Drop-Down-Liste zeigt:

formDemo.html
Formular Demo

Die Auswahlliste ist ein wahres Kraftpaket, Sie sollten also wissen, wie es zu machen:

  1. Erstellen Sie das Element zuerst.

    Der Behälter für die Liste ist ein Element. Die gesamte Liste ist in dem Paar ummantelt.

  2. Gib die wählen Element eine ID.

    Sie finden diese ID verwenden, um das Element im Code zu verweisen.

  3. Fügen Sie ein Option Element mit dem Auswahlelement.

    Es hilft, die Optionen einrücken um sich zu erinnern, dass sie Teil der sind wählen Objekt.

  4. Geben Sie jeder Option einen Wert.

    Der Wert ist die Reaktion auf ein Programm gesendet wird, wenn der Benutzer eine Option wählt. Der Benutzer wird nicht unbedingt den Wert sehen.

  5. Geben Sie den Text der Benutzer zwischen den sehen und Tags.

    Dies kann aus dem Wert oder demselben verschieden sein. (Das wird mehr Sinn machen, nachdem Sie tun einige javascript-Codierung.)

  6. Fügen Sie so viele Optionen, wie Sie wollen.

    Erstellen Sie eine neue Option Objekt für jede Wahl, die Sie in der Liste zur Verfügung haben wollen.

Wählen Boxen nicht haben das Dropdown-Verhalten zu haben. Wenn Sie das Feld zu nehmen mehr vertikalen Raum auf der Seite möchten, geben Sie einfach die Anzahl der Zeilen mit der Größe Attribut.

Ähnliche

Menü