1

我正在尝试填充我的下拉列表，我通过手动将每个变量输入到数组中来让它工作，但是我希望能够使用循环添加数组。

抱歉，我是 javascript 新手

<select id="selectNumber">
    <option>Choose a number</option>
</select>

var select = document.getElementById("selectNumber");
var options = new Array(51);
var firstyear = ( new Date().getFullYear() ) - 17;
var temp = 0;

for ( var i = 0; i < 51; i++ ) {
    temp = firstyear - 1;
    options.push( temp );

    alert( temp );
}
alert ( options );

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 );
}
4

3 回答 3

1

我认为这应该有效：

<select id="selectNumber">
    <option>Choose a number</option>
</select>

<script>
var select = document.getElementById("selectNumber");
var options = new Array();
var firstyear = (new Date().getFullYear()) - 17;
var temp = firstyear;

for(var i = 0; i < 51; i++) {
    options.push(temp);
    temp--;
    }

for(var i = 0; i < options.length; i++) {
    var opt = options[i];
    var el = document.createElement("option");
    el.text = opt;
    el.value = opt;
    select.appendChild(el);
}
</script>
于 2013-08-28T03:52:00.127 回答
0

你非常接近，但你错过了一个“）”字符。

你有：

for(var i = 0; i < 51; i++ {

它应该是：

for(var i = 0; i < 51; i++) {

注意：循环的调试输出通常最好使用 console.log 而不是 alert。它会在任何浏览器上显示 Javascript 控制台，但要小心将它们留在后面，因为如果它们留在那里并且控制台目前未打开，它会破坏 IE8（甚至可能是 9+？）！

于 2013-08-28T03:50:04.577 回答
0

您的代码中有几个小错误：

  • 您的 javascript 代码在页面上创建元素之前运行，因此document.getElementById("selectNumber");在调用它时未定义。您需要将代码包含在一个函数中，该函数将在文档完全创建后被调用。

  • 如果您使用初始化数组var options = new Array(51);然后使用options.push(...)，您将有 50 个空值，然后是您添加的值。您需要将初始化更改为var options = new Array();

  • 你忘记)了for(var i = 0; i < 51; i++ {

  • 您需要更改temp = firstyear - 1;为，temp = firstyear - i;否则您将使用相同值的 50 倍填充数组

  • 一个循环就足以实现这一目标

这是修复了这些问题的代码的更新版本：

document.ready = function() {
    var select = document.getElementById("selectNumber");
    var options = new Array();
    var firstyear = (new Date().getFullYear()) - 17;

    for (var i = 0; i < 50; i++) {
        var date = firstyear - i;
        var el = document.createElement("option");
        el.textContent = date;
        el.value = date;
        select.appendChild(el);
    }
}
于 2013-08-28T03:56:32.357 回答