18.06.2022, 14:15
Moin,
ich habe hier eine weitere Variante:
VG
rzscout
ich habe hier eine weitere Variante:
Code:
'use strict';
document.addEventListener('DOMContentLoaded', init());
var kontinent, land, auswahl;
const kontinente = ['Europa', 'Afrika', 'Asien'];
const europa = ['Italien','Spanien', 'Frankreich', 'Dänemark', 'Deutschland', 'Schweden', 'Griechenland'];
const afrika = ['Südfafrika', 'Somalia', 'Kenia', 'Marokko', 'Ägypten'];
const asien = ['Indien', 'Thailand', 'China', 'Mongolai'];
function init() {
kontinent = document.getElementById('kontinent');
land = document.getElementById('land');
kontinente.forEach((item) => {
let newElem = document.createElement('option');
newElem.setAttribute('value', item);
newElem.textContent = elem;
kontinent.appendChild(newElem);
});
kontinent.addEventListener('input', () => {
let currentVal = kontinent.value;
switch (currentVal) {
case 'Europa':
removeChildren;
addCountries(currentVal);
break;
case 'Asien':
removeChildren;
addCountries(currentVal);
break;
case 'Afrika':
removeChildren;
addCountries(currentVal);
break;
}
});
}
function addCountries(currentVal) {
if(currentVal == 'Europa') {
europa.forEach((item) => {
let newElem = document.createElement('option');
newElem.setAttribute('value', item);
newElem.textContent = item;
land.appendChild(newElem);
});
}
if(currentVal == 'Asien') {
asien.forEach((item) => {
let newElem = document.createElement('option');
newElem.setAttribute('value', item);
newElem.textContent = item;
land.appendChild(newElem);
});
}
if(currentVal == 'Afrika') {
afrika.forEach((item) => {
let newElem = document.createElement('option');
newElem.setAttribute('value', item);
newElem.textContent = item;
land.appendChild(newElem);
});
}
}
function removeChildren() {
while(land.firstChild) {
land.removeChild(land.firstChild);
}
}
VG
rzscout