Как динамически добавлять параметры существующего выбора в vanilla javascript
Я хотел бы добавить опцию для динамического выбора, используя простой javascript. Все, что я могу найти, включает JQuery или пытается создать выбор динамически. Самое близкое, что я мог найти, это Динамически добавлять тип ввода ввода с параметрами в Javascript, который делает последнее и был единственным, что я нашел, что не включает JQuery. Хотя я и попытался использовать его так:
daySelect = document.getElementById('daySelect');
daySelect.innerHTML += "<option'>Hello world</option'>";
alert(daySelect.innerHTML)
После того, как я сделал это, никаких изменений в выборе не было, и оповещение дало мне
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: Идея действительно работала, просто оказалось, что она не отображает значение в раскрывающемся списке. Я не знаю, почему, но я могу понять, что я думаю.
Ответы
Ответ 1
В этом учебнике показано, что вам нужно сделать: Добавить параметры в поле выбора HTML с javascript
В принципе:
daySelect = document.getElementById('daySelect');
daySelect.options[daySelect.options.length] = new Option('Text 1', 'Value1');
Ответ 2
Я думаю, что-то вроде этого выполнит эту работу.
var option = document.createElement("option");
option.text = "Text";
option.value = "myvalue";
var select = document.getElementById("daySelect");
select.appendChild(option);
Ответ 3
Используйте функцию document.createElement, а затем добавьте ее как дочерний элемент вашего выбора.
var newOption = document.createElement("option");
newOption.text = 'the options text';
newOption.value = 'some value if you want it';
daySelect.appendChild(newOption);
Ответ 4
Попробуйте это;
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');
Ответ 5
.add() также работает.
var daySelect = document.getElementById("myDaySelect");
var myOption = document.createElement("option");
myOption.text = "test";
myOption.value = "value";
daySelect.add(option);
Школа W3 - попробуйте
Ответ 6
Самый простой способ:
selectElement.add(new Option('Text', 'value'));
Да, это так просто. И это работает даже в IE8. И имеет другие дополнительные параметры.
Смотрите документы:
HTMLSelect Element.add (item [, before]);
новая опция (текст, значение, defaultSelected, selected);