как динамически добавлять параметры к существующему select в vanilla javascript

Я хотел бы добавить опцию в select динамически, используя простой javascript. Все, что я мог найти, включает JQuery или пытается создать select динамически. Самое близкое, что я смог найти динамически добавлять тип ввода Выберите с параметрами в Javascript что делает последнее и было единственным, что я нашел, что не связано с JQuery. Хотя я пытался использовать его так:

daySelect = document.getElementById('daySelect');
daySelect.innerHTML += "<option'>Hello world</option'>";
alert(daySelect.innerHTML)

после того, как я сделал это, не было никаких изменений в select и alert дал мне 

HELLO WORLD</option'>

Я извиняюсь, если это просто, но я очень новичок в javascript и веб-программировании в целом. Спасибо за любую помощь.

EDIT: поэтому я попробовал данные предложения так.

daySelect = document.getElementById('daySelect');
myOption = document.createElement("option");
myOption.text = "Hello World";
myOption.value = "Hello World";
daySelect.appendChild(myOption);

это не изменило выбор на странице вообще. Есть идеи почему? И я проверил, что код был запущен с предупреждением.

EDIT: идея сработала, просто оказалось, что она не отображает значение в раскрывающемся списке. Я не знаю почему, но я думаю, что могу это понять.

34
javascript select

5 ответов

в этом уроке показано, что именно вам нужно сделать:добавить параметры в поле выбора HTML с помощью javascript

по сути:

 daySelect = document.getElementById('daySelect');
 daySelect.options[daySelect.options.length] = new Option('Text 1', 'Value1');
63

Я думаю, что-то вроде этого сделает работу.

var option = document.createElement("option");
option.text = "Text";
option.value = "myvalue";
var select = document.getElementById("daySelect");
select.appendChild(option);
14

использовать документ.createElement функции, а затем добавить его в качестве дочернего элемента вашего выбора.

var newOption = document.createElement("option");
newOption.text = 'the options text';
newOption.value = 'some value if you want it';
daySelect.appendChild(newOption);
5

попробуй это:

   var data = "";
   data = "<option value = Some value> Some Option </option>";         
   options = [];
   options.push(data);
   select = document.getElementById("drop_down_id");
   select.innerHTML = optionsHTML.join('\n');
0

.добавить() тоже работает.

var daySelect = document.getElementById("myDaySelect");
var myOption = document.createElement("option");
myOption.text = "test";
myOption.value = "value";
daySelect.add(option);

W3 школа-попробуйте

0