我想用javascript在下拉列表中填写五年，年份将在当前年份之后

I want fill five years in a drop-down using javascript and the years will be after the current years

本文关键字：五年 之后 javascript 下拉列表      更新时间：2023-09-26

我想使用javascript在下拉列表中填写五年，年份将在当前年份之后。

例如：

如果当前年份是2012年，则下拉值为20122013201420152016

HTML

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

JavaScript

var myselect = document.getElementById("year"), year = new Date().getFullYear();
var gen = function(max){do{myselect.add(new Option(year++,max--),null);}while(max>0);}(5);

更好一点的JavaScript功能：

var myselect = document.getElementById("year"),
    startYear = new Date().getFullYear()
    count = 5;
(function(select, val, count) {
  do {
    select.add(new Option(val++, count--), null);
  } while (count);
})(myselect, startYear, count);

jsFiddle，新的jsFiddle

你可以得到这样的年份列表…

var date = new Date,
    years = [],
    year = date.getFullYear();
for (var i = year; i < year + 5; i++) {
   years.push(i);   
}

jsFiddle。

或者实际创建select元素。。。

var date = new Date,
    year = date.getFullYear(),
    select = document.createElement('select');
for (var i = year; i < year + 5; i++) {
    var option = document.createElement('option'),
        yearText = document.createTextNode(i);
    option.appendChild(yearText);
    select.add(option);   
}
select.name = 'year';
document.body.appendChild(select);

jsFiddle。

如果使用jQuery，任务可以实现如下：

   var currentYear = new Date().getFullYear();  
    for (var i = 1; i <= 5; i++ ) {
        $("#timeSelector").append(
            $("<option></option>")
                .attr("value", currentYear)
                .text(currentYear)
        );
        currentYear++;
    }

在jsFiddle 上查看演示

var currentYear = new Date().getFullYear(); 
     for (var i = 0; i < 5; i++ ) {
            $("#years").append(
               $('<option/>')
               .attr("value", currentYear + i)
               .text(currentYear + i));
        }
相关文章：