JavaScript ist eine Skriptsprache, die in der Webentwicklung weit verbreitet ist. Unter diesen ist das Dropdown-Feld (Dropdown-Liste) ein häufig verwendetes Steuerelement bei der Seitenentwicklung, mit dem Benutzer einen Wert aus einer Reihe vordefinierter Optionen auswählen können. In JavaScript müssen wir normalerweise den vom Benutzer ausgewählten Wert verarbeiten, daher müssen wir den Index des im Dropdown-Feld ausgewählten Werts kennen. In diesem Artikel wird ausführlich beschrieben, wie Sie den Index des im Dropdown-Feld ausgewählten Werts in JavaScript abrufen.
1. Grundlegende Verwendung des Dropdown-Felds
Das Dropdown-Feld wird in HTML mit dem
<select id="mySelect"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="opel">Opel</option> <option value="audi">Audi</option> </select>
In diesem Dropdown-Feld gibt es 4 Optionen. Der Wert und der Anzeigetext jeder Option sind „volvo“, „Volvo“, „saab“, „Saab“. , „opel“ bzw. , „Opel“, „audi“, „Audi“. Unter diesen definiert das Wertattribut den Wert der Option. Wenn das Wertattribut nicht angegeben ist, ist der Standardoptionswert der angezeigte Text. Die standardmäßig ausgewählte Option im Dropdown-Feld ist die erste Option, „Volvo“.
In JavaScript können Sie das Dropdown-Box-Element über die Methode getElementById() abrufen:
var selectElement = document.getElementById("mySelect");2. Holen Sie sich den Index der ausgewählten Option
Es gibt viele Möglichkeiten, den Index der ausgewählten Option im Drop abzurufen -Down-Box. Diese Methoden werden unten vorgestellt.
selectedIndex-Eigenschaft gibt den Index der ausgewählten Option zurück. Standardmäßig ist der Wert des selectedIndex-Attributs 0, was die erste Option ist. Wir können die ausgewählte Option ändern, indem wir den Wert des selectedIndex-Attributs ändern.
Angenommen, wir möchten den Index der ausgewählten Option im Dropdown-Feld erhalten, können wir so schreiben:
var selectElement = document.getElementById("mySelect");
var selectedOptionIndex = selectElement.selectedIndex;Das Wertattribut gibt den Wert der ausgewählten Option zurück. Wir können den Index der ausgewählten Option über das Attribut selectedIndex abrufen und dann den Wert der Option abrufen.
Angenommen, wir möchten den Wert und den Index der ausgewählten Option im Dropdown-Feld erhalten, können wir so schreiben:
var selectElement = document.getElementById("mySelect");
var selectedOptionIndex = selectElement.selectedIndex;
var selectedOptionValue = selectElement.options[selectedOptionIndex].value;Optionssammlung enthält alle
Angenommen, wir möchten die Werte und Indizes aller Optionen im Dropdown-Feld erhalten, können wir so schreiben:
var selectElement = document.getElementById("mySelect");
for(var i = 0; i < selectElement.options.length; i++) {
var optionValue = selectElement.options[i].value;
var optionIndex = i;
}4. Zusammenfassung
In JavaScript gibt es viele Möglichkeiten, den Index der zu erhalten Der im Dropdown-Feld ausgewählte Wert, einschließlich der Verwendung von selectedIndex-Attributen, Wertattributen und Optionssammlungen. Unter diesen gibt das Attribut selectedIndex den Index der ausgewählten Option zurück, das Attribut value gibt den Wert der ausgewählten Option zurück und die Optionssammlung enthält Informationen zu allen Optionen. Verschiedene Methoden eignen sich für unterschiedliche Arten von Anwendungsszenarien, und wir können die geeignete Methode zur Implementierung der Funktion entsprechend der tatsächlichen Situation auswählen.
Das obige ist der detaillierte Inhalt vonSo erfahren Sie den Index des im Dropdown-Feld ausgewählten Werts in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
