如何在html的下拉列表中绑定最近12个月?

时间:2016-02-18 10:33:17

标签: javascript jquery html json

我的网络应用程序中有一个下拉列表,我需要能够以适当的顺序绑定最近12个月。假设现在是2016年2月,那么下拉列表必须显示3月,然后是4月,5月,6月......直到1月。

<label>Select Month</label>
<select id = "drp1" onchange="mnth=this.value; drawChart1();">
    <option value="JAN">January</option>
    <option value="FEB">February</option>
    <option value="MAR">March</option>
    <option value="APR">April</option>
    <option value="MAY">May</option>
    <option value="JUN">June</option>
    <option value="JUL">July</option>
    <option value="AUG">August</option>
    <option value="SEP">September</option>
    <option value="OCT">October</option>
    <option value="NOV">November</option>
    <option value="DEC">December</option>
</select>

我希望页面加载时的值按正确顺序排列。我无法弄清楚哪个Javascript函数可以执行此操作,或者如何将值绑定到JSON并使用它来在下拉列表中创建选项。有人可以帮帮我吗?

1 个答案:

答案 0 :(得分:4)

  

new Date()将返回当前的Date对象。

DateObj.getMonth()将从Date对象(0-11)返回month

您可以像这样动态创建选项:

var date = new Date();
date.setMonth(date.getMonth() + 1);
var months = 12;
var monthNames = ["January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December"
];
var select = document.getElementById('drp1');
var html = '';
for (var i = 0; i < months; i++) {
  var m = date.getMonth();
  html += '<option value="' + monthNames[m] + '">' + monthNames[m] + '</option>'
  date.setMonth(date.getMonth() + 1);
}
select.innerHTML = html;
<select id="drp1"></select>

Fiddle here