0

我有以下 HTML 会在 DOM 准备好后生成..

<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();
  }
});

所以有了这个功能，我几乎可以在 5 月之后的任何一个月移除，这很酷。

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

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

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

任何建议都会很棒！

4

4 回答 4

1

创建一个新的日期对象new Date()并获取月份，getMonth()这将为您提供当前月份...

试试这个

$('#mmonths option').each(function() {
  var mvalues = parseInt($(this).val());
  var d = new Date(),m = d.getMonth();
  if(mvalues > parseInt(m + 2)) { 
   $(this).remove();
  }
});

然而，

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

我不认为你的代码现在正在这样做......因为你只是删除了比当前日期更大的月份并且对前几个月什么都不做......

所以，这不会隐藏你到 11 月或 12 月的其他月份……至少这会让你感动，因为你对当前日期有一些了解

于 2013-04-30T17:08:33.080 回答
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。如果您愿意，这也可以避免选择前几个月。

在此处查看演示

于 2013-04-30T17:08:53.297 回答
0

你可以这样做：

$('#mmonths option').filter(function() {
    var current_month = (new Date).getMonth();
    var month = parseInt($(this).val(), 10) - 1;
    var diff = month - (current_month + 1) % 12;

    if (diff < 0) {
        diff += 12;
    }

    return diff >= 2;
}).remove();

尽管这将在 11 月的情况下将 12 月置于 1 月之后。

于 2013-04-30T17:11:36.513 回答
0

这是另一种选择

删除月份选择元素中的所有项目

<select class="mdropdown" name="mde502fbrp__40[]" id="mmonths">
</select>

然后使用下面的 JavaScript

 var months = [ "January", "February", "March", "April", "May", "June", "July",
                "August", "September", "October", "November", "December" ];

var d = new Date, 
    from = d.getMonth(), 
    to = from + 3,
    select = document.getElementById("mmonths");

for( var i = from; i < to; i++ ) {

    var _m = i % 12; // if month more than 11 then use remainder
    select.appendChild( new Option( months[ _m ], _m ) );

}

在这里提琴

于 2013-04-30T17:24:51.347 回答