如何将默认值添加到动态下拉列表？答案

【问题标题】：how to add default value to dynamic dropdown list?如何将默认值添加到动态下拉列表？
【发布时间】：2018-07-28 16:00:37
【问题描述】：

我找到了关于如何制作用于选择年份的动态下拉列表的代码，但我不知道如何为下拉列表添加默认值，这是我找到的代码

HTML looping option values in drop down list

HTML

<select id="year"></select>

JS

var start = 2018;
var end = new Date().getFullYear();
var options = "";
for(var year = start ; year <=end; year++){
  options += "<option>"+ year +"</option>";
}
document.getElementById("year").innerHTML = options;

我试过这样但是不行

<select id="year">
<option value=''>Year</option>    
</select>

还有这个

var start = 2018;
var end = new Date().getFullYear();
var options = "<option value=''>Year</option>";
for(var year = start ; year <=end; year++){
  options += "<option>"+ year +"</option>";
}
document.getElementById("year").innerHTML = options;

我想要的结果是这样的

<select id="year">
<option value=''>Year</option> 
<option value=''>2018</option> 
<option value=''>2017</option>   
</select>

有人知道怎么做吗？

没想到会有很多答案，谢谢大家，我要试试你的答案

【问题讨论】：

标签： javascript html

【解决方案1】：

你快到了，试试下面的代码

var start = 2012;
var end = new Date().getFullYear();
var options = "<option value='' selected>Year</option>";
for(var year = start ; year <=end; year++){
  options += "<option>"+ year +"</option>";
}
document.getElementById("year").innerHTML = options;

&lt;select id="year"&gt;&lt;/select&gt;

【讨论】：

【解决方案2】：

试试这个：

var start = 2015;
var end = new Date().getFullYear();

var arrDate = function(start, end) {
    var count = (end - start) + 1;
    return Array.apply(0, Array(count)).map(function (element, index) { 
        return index + start;  
    });
}

arrDate(start, end).forEach(function(v) {
    document.getElementById("year").innerHTML += "<option value='"+v+"'>"+ v +"</option>";
});

<select id="year">
<option value=''>Year</option>    
</select>

【讨论】：

【解决方案3】：

只需将selected 属性添加到options 之一，使其成为默认选择选项。

<select>
<option>1</option>
<option selected>2</option>
<option>3</option>
</select>

<select id="year">

</select>
<script>
var start = 2010;
var end = new Date().getFullYear();
var options = "<option value='' selected>Year</option>";
for(var year = start ; year <=end; year++){
  options += "<option>"+ year +"</option>";
}
document.getElementById("year").innerHTML = options;
</script>

【讨论】：

【解决方案4】：

您希望在年份的下拉列表中显示默认值。试试下面的代码，让我知道这是否是你想要的！

html代码：

<select id="year"></select>

js代码：

var startYear = 2017;
var endYear = new Date().getFullYear();
var options = "<option selected>"+startYear+"</option>";

for(var year = start + 1; year <= end; year++){
  options += "<option>"+ year +"</option>";
}

document.getElementById("year").innerHTML = options;

【讨论】：

【解决方案5】：

如果我理解正确，我们想选择当前年份。

var start = 2017;
var end = new Date().getFullYear();
var options = "<option value=''>Year</option>";

for (var year = start; year <= end; year++) {
  var selected = year === end ? " selected" : "";
  options += "<option value=\"" + year + "\"" + selected + ">"+ year +"</option>";
}
document.getElementById("year").innerHTML = options;

【讨论】：