在下拉列表中循环多年

时间:2014-10-13 15:14:40

标签: javascript jquery html

我想显示当年和当年之前的10年。

通过JavaScript或jQuery可以做到这一点吗?

目前,我手动输入值。

HTML:

<span>Year:</span>
<select name="year">
    <option value="2014">2014</option>
    <option value="2013">2013</option>
    And so on....
</select>

我知道如何在JavaScript中获取当前年份

这是我目前的

var d = new Date();
var y = d.getFullYear();

2 个答案:

答案 0 :(得分:5)

$(function() {
  var start_year = new Date().getFullYear();

  for (var i = start_year; i > start_year - 10; i--) {
    $('select').append('<option value="' + i + '">' + i + '</option>');
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<span>Year:</span>
<select name="year"></select>

但像mustache.js这样的模板引擎更适合这项工作,所以你可以避免在你的javascript中使用标记代码。

答案 1 :(得分:2)

html

<select name="example" id="select" ></select> 

Javascript版

(function(){
    var start_year = new Date().getFullYear();
    var html ='';
    for (var i = start_year; i > start_year - 10; i--) {
       html += '<option value="'+i+'">'+i+'</option>';
    }
   document.getElementById("select").innerHTML = html;
})()

Jquery版本

$(function() {
  var start_year = new Date().getFullYear();
  var html = ''
  for (var i = start_year; i > start_year - 10; i--) {
    html += '<option value="'+i+'">'+i+'</option>';
  }
 $("#select").html(html)
});