JavaScript - Optionen in der Auswahlliste je nach Alter der Person anzeigen
Die Altersgrenze liegt in diesem Beispiel bei 14 Jahren.
<style>
select#options {
width: 135px;
}
</style>
<p>
<label>Alter:<br>
<input type="number" name="age" id="age" required></label>
</p>
<p>
<label>Auswahl:<br>
<select name="options" id="options" size="5" required></select></label>
</p>
<script>
const opt = ["Option 1", "Option 2", "Option 3", "Option 4", "Option 5"];
document.querySelector("#age").addEventListener("input", (e) => {
document.querySelector("#options").innerHTML = "";
let age = e.target.value;
let nrs = 0;
if (age <= 14) { // Altersgrenze
nrs = 2;
} else {
nrs = 4;
}
for (let i = 0; i <= nrs; i++) {
document.querySelector("#options").options[i] = new Option(opt[i]);
}
});
</script>
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<caption> Tabellenüberschrift
CSS - Ladeanimation ohne Bild-Grafik
PHP - Nur Zahlen in Arrays beibehalten