Невозможно добавить один и тот же элемент option в несколько раскрывающихся списков.

Question

У меня есть два выпадающих на странице. Когда кнопка нажата, мне нужно добавить новую опцию в оба выпадающих меню (одну и ту же опцию добавить в обе). Значения параметров хранятся в массиве. Сначала я создаю новый элемент параметра new_option и задаю его значение / текст из массива, а затем параметр добавляется в раскрывающийся список с помощью dropdown1_name.options.add(new_option) и dropdown2_name.options.add(new_option).

Но на практике новая опция добавляется только ко второму раскрывающемуся списку, к которому я ее добавляю, но не к первому, т. Е. Если я выполняю dropdown2.add, за которым следует dropdown1.add, тогда только dropdown1 получает новый параметр.

Это легко исправить, создав с нуля реплику нового элемента option и добавив одну копию в каждый выпадающий список. Но это не имеет смысла для меня, поэтому смысл этого вопроса в том, что я действительно хотел бы понять, что вызывает такое поведение в первую очередь. Почему нельзя добавить один и тот же новый параметр в оба раскрывающихся списка?

Эта скрипка, которую я только что сделал , имеет тестовую настройку.

Answer 1

Проблема в том, что вы добавляете один и тот же экземпляр <option> в оба раскрывающихся списка:

dropdown2.options.add(el1);
dropdown1.options.add(el1);
//                    ^^^ notice "el1" twice

Вместо этого необходимо добавить el2 к dropdown2:

dropdown2.options.add(el2);
dropdown1.options.add(el1);

Надеюсь, это поможет вам:)