Ошибка в переданном параметре функции

Question

В 3й раз передаю в функцию селект и массив(первые два раза всё нормально) и получаю ошибку... через console.log вместо списка городов получаю undefinded

let data={
    Russia:['Moscow','Petersburg','Yekaterinburg'],
    USA:['New York', 'California', 'Seattle'],
    Germany:['Berlin', 'Munich', 'Cologne'],
    England:['London', 'York', 'Birmingham'],
    France:['Paris','Strasbourg','Nice']

}
let citiesSelect=document.querySelector('#cities')
let countriesSelect=document.querySelector('#countries')

let countries=Object.keys(data) // добавим страны начиная  с 1 в массиве коючей
    console.log(countries)
addOption(countriesSelect,countries)

let defaultCities=data[countries[0]] //город по дефолту,1й из 1го массива значений
console.log(defaultCities)
addOption(citiesSelect,defaultCities)

countriesSelect.addEventListener('change',()=>{
let cities=data[this.value] // массив городов,для выбранной страны
    console.log(cities)
    citiesSelect.length=0
    addOption(citiesSelect,cities)
})

function addOption(select,arr){
    for(let i=0;i<arr.length;i++){
        select.add(new Option(arr[i],arr[i]))
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <select id="countries"></select>
    <select id="cities"></select>
</head>
<body>

Answer 1

У вас Option создаётся с названием и без значения. Попробуйте так

select.app(new Option(arr[i], arr[i]))

Option

this в калбэке на change указывает не на select нужно использовать объект event

countriesSelect.addEventListener('change',(event)=>{
let cities=data[event.target.value]

БЛОГ НА HUSL

Ошибка в переданном параметре функции

Ответы (1 шт):