Das Select-Tag in HTML ermöglicht eine Auswahlfunktion aus der Liste der Optionen, z. B. ein Dropdown-Menü oder ein Mehrfachauswahlmenü. Es handelt sich um ein Tag, das in der Form des HTML-Codes verwendet werden kann, der zum Erstellen und Implementieren einer Webseite verwendet wird. Die Syntax lautet wie folgt: „, wobei jedes Element in der Liste vom Option-Tag umschlossen wird und die Benutzerauswahlfunktion ermöglicht. Um andere Auswahlmethoden wie „Opt-Gruppe“ und „Mehrfachauswahl“ zu erleichtern, ist die Option
Auswahl-Tag kann Tag.
Die Syntax für dieses Tag lautet wie folgt:
<select> <option> Value </option> <option> Value </option> </select>
Die obige Syntax
Auswählen mehrerer Optionen mithilfe der Schaltfläche
Es wird wie folgt sein:
<select multiple> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> </select>
Eine der wichtigsten Verwendungsmöglichkeiten des
Die Syntax hierfür lautet wie folgt:
<select > <optgroup label = "labelname"> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <optgroup> </select>
Größe: Die obige Syntax kann auch die Größe definieren, sodass nur definierte Größen angezeigt werden
Option nur das ist wie folgt:
<select value="" size="4"> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> </select>
automatisches Ausfüllen: Wählen Sie das Tag aus, das auch zum automatischen Ausfüllen der Feldwerte wie folgt verwendet wird:
<select > <option value=" " autocomplete="off"> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> </select>
Autofokus: Wir können uns wie folgt jeweils auf eine bestimmte Option aus der Liste konzentrieren. Auf einer einzelnen Seite kann nur ein Autofokus verwendet werden.
<select autofocus> <option value=" "> Content Name </option> <option value=" "> Content Name </option> <option value=" "> Content Name </option> </select>
Link: Tag auswählen wird verwendet, um den Formularlink über die angegebene Option zu öffnen, wie in der folgenden Syntax definiert:
<form action="" id="name"> </form> <Select name="" form="Id_name"> <option value=" "> Content Name </option> </select>
erforderlich: Diese Option im Select-Tag definiert eine obligatorische Option aus der definierten Liste vor der eigentlichen Übermittlung des Formulars.
<select name="value" required> <option value=" "> Content Name </option> <option value=" "> Content Name </option> </select>
Platzhalter: Wie wir wissen, wird bei Verwendung einer Auswahlbezeichnung die erste Option als Standardoption betrachtet. Wenn wir jedoch eine Option als Standard anzeigen möchten, können wir das ausgewählte Schlüsselwort festlegen zur spezifischen Option wie folgt:
<select name="value" > <option value=" "> Content Name </option> <option value=" " selected> Content Name </option> </select>
deaktiviert: ein weiterer nützlicher Trick in der Option zum Auswählen des Tags zum Anzeigen im deaktivierten Format wie folgt:
Mit dieser Option kann die Option angezeigt werden, es ist jedoch nicht möglich, Maßnahmen zu ergreifen.
<select name="value" > <option value=" " disabled> Content Name </option> <option value=" "> Content Name </option> </select>
Hier sind die folgenden Beispiele.
In diesem Beispiel zeigen wir ein einfaches Select-Tag als Auswahlliste, Optgroup und zum gleichzeitigen Auswählen mehrerer Optionen, wie unten gezeigt:
Code
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.div-container {
display: table;
width: 100%;
}
.block {
display: table-cell;
padding: 10px;
}
</style>
</head>
<body>
<div class="div-container">
<div class="block">
<h4>Simple Select tag </h4>
<select name="Web Languages">
<option> HTML 5 </option>
<option> CSS 3</option>
<option> Bootstrap </option>
<option>Angular </option>
<option> React JS </option>
<option> Vue JS</option>
<option>Python </option>
<option>PHP</option>
</select> <br>
</div>
<div class="block" >
<h4>Optgroup Select tag </h4>
<select>
<optgroup label="2 wheeler">
<option value="Honda">Shine</option>
<option value="Suzuki">Access</option>
</optgroup>
<optgroup label="4 wheeler">
<option value="m">Mercedes</option>
<option value="o">Audi</option>
</optgroup>
</select>
</div>
<div class="block" >
<h4>Multiple Selection in Select tag </h4>
<select multiple>
<option> Green </option>
<option> Orange</option>
<option> Blue </option>
<option>Red </option>
<option> Yellow </option>
</select>
</div>
</div>
</body>
</html>Ausgabe:
Dieses Beispiel definiert, wie über den Link über
Code
<!DOCTYPE html> <html> <head> <title>select Tag form link</title> </head> <body> <form action = "C:\Users\Sonali\Desktop\HTML colspan.html" method = "post"> <select name = "list"> <option value = "menu 1">Colspan tag</option> <option value = "menu 2" selected>Font Tag</option> </select> <input type = "submit" value = "Submit" /> </form> </body> </html>
Ausgabe: Nachdem Sie den Colspan-Tag-Wert ausgewählt und mit der Schaltfläche „Senden“ ausgewählt haben, öffnet die Liste das verknüpfte Formular.
Die Liste enthält mehrere Optionen, es werden jedoch Optionen entsprechend der definierten Größe angezeigt.
Code
<!DOCTYPE html> <html> <head> <title>select Tag form link</title> </head> <body> <select name = "places" size="5"> <option>Aurangabad</option> <option>Beed</option> <option>Chennai</option> <option>Delhi</option> <option >Egatpuri</option> <option >Firozabad</option> <option >Fatimpur</option> <option >Goa</option> <option >Harihareshwar</option> <option >Indonesia</option> <option >Japan</option> <option >Kolkata</option> <option >Latur</option> <option >Mumbai</option> <option >Nagpur</option> <option >Oty</option> <option >Pune</option> <option >Qatar</option> <option >Raipur</option> <option >Sholapur</option> <option >Tamil Nadu</option> <option >Uttarakhand</option> </select> </body> </html>
Ausgabe:
Das Select-Tag in HTML zeigt die Auswahlliste zur Auswahl einer oder mehrerer Optionen aus der Liste an.
Das obige ist der detaillierte Inhalt vonWählen Sie „Tag in HTML' aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
