javascript - 如何通过 jQuery 动态设置日期的有限范围

Question

一旦 DOM 准备好，我就会生成以下 HTML..

<div class="session-block mdatepicker">

<label>Next Appointment Date</label>

<select class="mdropdown" name="mde502fbrp__40[]" id="mdays">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30" selected="selected">30</option>
<option value="31">31</option>
</select>

<select class="mdropdown" name="mde502fbrp__40[]" id="mmonths">
<option value=""></option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4" selected="selected">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>

<select class="mdropdown" name="mde502fbrp__40[]" id="myears">
<option value=""></option>
<option value="2013" selected="selected">2013</option>
</select>

</div>

我的目标是限制月份，以便只有接下来的 2 个月出现在下拉列表中。所以我可以用像这样的一些 jQuery 来做到这一点......

$('#mmonths option').each(function() {
  var mvalues = parseInt($(this).val());
  if(mvalues > 5) { 
   $(this).remove();
  }
});

因此，有了这个功能，我几乎可以删除五月之后的任何一个月，这很酷。

但我不想每个月都回到这个代码，只是为了对我的 mvalues 变量进行调整。相反，我希望它知道当前日期是 X，并且始终仅显示当前日期之前的 2 个月，无论是六月、七月、八月等...

当到了 11 月时，我想显示 12 月和 1 月等。

但我不确定在哪里或如何学习如何做到这一点......

任何建议都会很棒!

Answer 1

试试这个——

var today_date = new Date();
var currentMonth = today_date.getMonth();

$('#mmonths option').each(function() {
  var mvalues = parseInt($(this).val());
  if(mvalues > currentMonth + 3 || mvalues <= currentMonth) { 
   $(this).remove();
  }
}); 

.getMonth() 将返回月份，但它返回 0 - 11 之间而不是 1-12 之间。因此需要添加这一数字，并在接下来的两个月内将其设为 3。如果您愿意，这也可以避免选择前几个月。

参见demo here