我已经在脚本中声明数组：的JavaScript - 填充下拉列表与数组
var myArray = new Array("1", "2", "3", "4", "5" . . . . . "N");
我有一个包含一个下拉菜单形式：
<form id="myForm">
<select id="selectNumber">
<option>Choose a number</option>
</select>
</form>
使用JavaScript，怎么会我用数组值填充下拉菜单的其余部分？使得选项将是 “选择一个号码”， “1”， “2”， “3”， “4”， “5”。 。 。 。 。 “N”？
你会通过你的数组元素需要循环，创建一个新的DOM节点的每个并将它添加到您的对象。
var select = document.getElementById("selectNumber");
var options = ["1", "2", "3", "4", "5"];
for(var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}
我有一个错误'的textContent和值不是function'和解决方案是** **投选择为String这样的： 'el.textContent =字符串（OPT）; 报。value = String（opt）;' 这是在** opt **的情况下不是_ ** String ** _。 – 2018-01-08 10:30:57
@AbdallahOkasha这没有意义。如果您尝试像这样使用'el.textContent'，那么会发生错误：'el.textContent（opt）'。如果你像在我的例子中那样使用它，不管它是否是一个“数字”，浏览器都会将它变成一个字符串。 – 2018-01-08 16:29:49
感谢关心..实际上，我试着写'el.textContent = arr [i]'或'el.value = arr [i]'并且出现错误：** _ value_，_text_和_textContent_不是功能**。 – 2018-01-09 10:27:51
像这样的东西应该工作：
var dropdown = document.getElementById("dropdown1");
if (dropdown) {
for (var i=0; i < month.length;++i){
addOption(dropdown, month[i], month[i]);
}
}
addOption = function(selectbox, text, value) {
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
selectbox.options.add(optn);
}
您可以参考本文的详细信息：
http://www.plus2net.com/javascript_tutorial/list-adding.php
["1","2","3","4"].forEach(function(item) {
var o = document.createElement("option");
o.textContext = item;
document.getElementById("myselect").appendChild(o);
});
这只适用于兼容HTML5的浏览器！ – 2012-03-27 18:21:55
你会首先得到下拉元素从DOM耳鼻喉科，然后通过数组循环，并添加每个元素作为下拉这样一个新的选项：
// Get dropdown element from DOM
var dropdown = document.getElementById("selectNumber");
// Loop through the array
for (var i = 0; i < myArray.length; ++i) {
// Append the element to the end of Array list
dropdown[dropdown.length] = new Option(myArray[i], myArray[i]);
}
见的jsfiddle了现场演示：http://jsfiddle.net/nExgJ/
这是假设你不使用JQuery，而只有基本的DOM API可以使用。
请注意，我遇到这个问题时，我复制粘贴此代码：http://stackoverflow.com/questions/4404526/unexpected-token-illegal-in-webkit – 2013-04-11 19:42:22
@NielsBrinch - 不要直接复制和粘贴来自JSFiddle。 :) – DashK 2013-04-11 22:28:46
我实际上是从Stackovervflow复制粘贴的，而不是小提琴 - 但也许是从他自己的小提琴中复制粘贴的stackoverflow作者和复制粘贴进行了！ :) – 2013-04-12 08:11:39
<form id="myForm">
<select id="selectNumber">
<option>Choose a number</option>
<script>
var myArray = new Array("1", "2", "3", "4", "5" . . . . . "N");
for(i=0; i<myArray.length; i++) {
document.write('<option value="' + myArray[i] +'">' + myArray[i] + '</option>');
}
</script>
</select>
</form>
你也可以做到这一点使用jQuery：
var options = ["1", "2", "3", "4", "5"];
$('#select').empty();
$.each(options, function(i, p) {
$('#select').append($('<option></option>').val(p).html(p));
});
在这个问题中没有jQuery标签。 – 2015-12-20 02:20:32
我认为这是不需要投票的，可能会帮助某人。 jQuery是一个JavaScript框架，并提出了JavaScript的问题。像这样的行为会激发人们的贡献。 – 2015-12-21 08:31:10
请参阅http://meta.stackexchange.com/questions/45176/when-is-use-jquery-not-a-valid-answer-to-a-javascript-question – 2015-12-21 19:19:06
我发现这也是工程...
var select = document.getElementById("selectNumber");
var options = ["1", "2", "3", "4", "5"];
// Optional: Clear all existing options first:
select.innerHTML = "";
// Populate list with options:
for(var i = 0; i < options.length; i++) {
var opt = options[i];
select.innerHTML += "<option value=\"" + opt + "\">" + opt + "</option>";
}
我有同样的要求，我用 “亚历克斯·图尔平” 解决方案如下所述进行小的更正。
var select = document.getElementById("selectNumber");
var options = ["1", "2", "3", "4", "5"];
for(var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.text = opt; el.value = opt; select.add(el);
}
更正，因为与使用appendChild（）函数是负载当DOM准备。所以它不适用于旧的（8或更少）IE版本。所以改正它工作正常。
亚历克斯感谢您的解决方案。
的一些注意事项，请发表您的尝试和任何错误消息（S）你得到。谢谢。 – bernie 2012-03-27 18:11:37