JavaScript: Name und Wert eines <select> / <option> Elements auslesen
Um mit JavaScript interaktive Webseiten zu gestalten, kommt es hin und wieder vor, die Eingaben eines Drop-Down Menüs auszulesen. Diese <select> Menüs enthalten mehrere Werte, die untereinander in einem ausklappbaren Menü angezeigt werden. Mit JavaScript kann man dabei aber nicht nur auf den Wert, sondern auch auf den Namen des ausgewählten <option> Eintrags zugreifen und diesen weiter verwenden!
So sieht es aus:
Wichtig ist, dass das <select> Element eine eindeutige ID besitzt – in unserem Beispiel “selectmenue”. Über “document.getElementById(‘selectmenue’)” lässt sich dann auf das <select> Element der Seite zugreifen und über element.options[element.selectedIndex] sowohl der Wert (“value”) als auch der angezeigte Name (“text”) des ausgewählten Elements anzeigen.
Der komplette Code dazu:
<select id="selectmenue" onchange="wertauslesen()"> <option value="1">Eins</option> <option value="2">Zwei</option> <option value="3">Drei</option> <option value="4">Vier</option> <option value="5">Fünf</option> </select> <script type="text/javascript"> function wertauslesen() { var element = document.getElementById('selectmenue'); var name = element.options[element.selectedIndex].text; var wert = element.options[element.selectedIndex].value; alert('Wert: '+wert+' - Name: '+name); } </script>
- Excel: Wert aus Zelle finden und nebenstehenden Wert ausgeben
- Photoshop Elements 11 - Versionssatz
Hallo,ich habe plötzlich das Problem, dass nach der Bearbeitung im Versionssatz gespeichert w...
- WD Elements 1023 USB Device keine Zuweisung Laufwerkbuchstabe
- WD Elements auf Externe Festplatte kann nicht zugegriffen werden Win8
- JavaScript Fehlermeldung
Also ich habe Windows7 Home Premium und den Firefox 19.Als ich ihn gestartet habe wollte der v...
- Betr.Javascript
Mein Computer-System:Windows 7 Firefox Installiertes Betriebssystem: 1 Hallo !Kann mir jemand ...
- Seitenzahlen mit Javascript
- datenschutz (48x gelesen)
- windows-beschleunigen (41x gelesen)
- windows-schneller-starten-autostart-aufraeumen (37x gelesen)
- pc-einsteigerkurs (23x gelesen)
- pc-einsteigerkurs-1-2 (14x gelesen)
Mehr Tipps zu JavaScript: Name und Wert eines <...
-
SEO: Hierauf müssen Sie bei Dateinamen achten!
Bei den Dateinamen von Webseiten, bei Bildern oder verlinkten Dokumenten gibt es einige Regeln zu beachten: Da der Webmaster nicht weiß, auf welchem Betriebssystem der...
-
PHP “rename”: Mit PHP Skript mehrere Dateien umbenennen
Dieses kleine Skript hilft dabei, viele Dateien schnell und einfach umzubenennen: Das ist zum Beispiel praktisch, um allen Bildern in einem Ordner eine fortlaufende Nummer...
-
PHP “rename”: Mit PHP Skript mehrere Dateien umbenennen
Dieses kleine Skript hilft dabei, viele Dateien schnell und einfach umzubenennen: Das ist zum Beispiel praktisch, um allen Bildern in einem Ordner eine fortlaufende Nummer...
-
PC oder Laptop finanzieren – Tipps und Wissenswertes
Beim Kauf eines neuen Notebooks ist der Preis häufig der entscheidende Faktor. Das Budget gibt nicht mehr her, also gibt es ein günstiges und finanzierbares...
-
PHP: RGB Farbwert in HEX-Farbwert umwandeln
Für Webseiten und deren HTML und CSS Code benötigt man die Farben als RGB-Werte: Diese werden allerdings hexadezimal und nicht dezimal angegeben. So hat man...
-
Webseiten-Titel ändern oder animieren mit JavaScript (mehr Aufmerksamkeit bei Tabs!)
Der Webseiten-Titel wurde früher in der Titelleiste des Browsers angezeigt: Mittlerweile sieht man den Text oft nur noch bei mehreren geöffneten Tabs. Für Besucher, die...
JavaScript: Name und Wert eines <select> / <option> Elements auslesen