Webtoepassingen moeten vaak weten de waarde van een element dat een gebruiker wordt geselecteerd. Als dat element een tekstvak of een ander fundamenteel besturingselement is, kan de app gewoon "Tekst"-eigenschap van het besturingselement om de waarde te krijgen onderzoeken. U kunt ook bepalen dat de geselecteerde waarde in een meer geavanceerde besturingselement, zoals een HTML-drop-down lijst. Drop-down lijsten kunnen bevatten een klein aantal items, zoals de dagen van de week, of honderden items opgehaald uit de productdatabase van een. Het inschakelen van uw Web-pagina om op te sporen van de geselecteerde vervolgkeuzelijst items door een eenvoudige JavaScript-functie toe te voegen aan uw HTML-document.
Start elke HTML-editor of Kladblok en open een van uw HTML-documenten.
Kopieer onderstaande code en plak deze in het hoofdgedeelte van het document:
De input knop geeft de naam van een drop-down lijst aan een JavaScript-functie die de geselecteerde waarde van de lijst bepaalt. De code boven de knop definieert de drop-down lijst.
Voeg de volgende code aan het HTML-document script sectie:
functie checkDropDown(id) {}
var dropDownObject = document.getElementById(id);
var geselecteerd = dropDownObject.value;
alert ("geselecteerde waarde =" + geselecteerde);
}
Deze functie--genoemd door de knop Klik--wordt de drop-down lijst-object opgehaald en de eigenschap value wordt gecontroleerd. De functie wordt ook die waarde opgeslagen in de variabele met de naam "geselecteerd." Een waarschuwingsvenster wordt die waarde weergegeven in dit voorbeeld, maar kunt u die waarde elke gewenste manier.
Sla het document. Start een browser en Bekijk het document. Hier ziet u de drop-down lijst en de knop.
Klik op de drop-down lijst en klik vervolgens op een van de items in de lijst. Klik op de knop "Toon Drop-Down waarde". De JavaScript-functie wordt uitgevoerd en uw geselecteerde waarde weergegeven.
- Als u met meerdere drop-down lijsten werkt, hun geselecteerde waarden bepalen door het passeren van hun ID-waarden aan de "checkDropDown"-functie.
