0

在日历应用程序中，我有一个简单的选择，其中包含相应月份的值为 0-11 的选项标签。我可以单向循环几个月（从 12 月到 1 月），但我无法让它以另一种方式工作。它只显示 2 月和 12 月。

这是一个 jsfiddle，显示了我已经完成的工作。

这是HTML：

<select id="MonthName" class="form-control">
    <option value="0">January</option>
    <option value="1">February</option>
    <option value="2">March</option>
    <option value="3">April</option>
    <option value="4">May</option>
    <!-- etc, through 11 -->
</select>

<!-- 'Buttons' -->
<span class="chevron chevronLeft floatLeft">◀</span>
<span class="theMonth">Month</span>
<span class="chevron chevronRight floatRight">▶&lt;/span>

这是jQuery：

$('.chevron').on('click', function() {
  // This if works perfectly, and will reset to 11 once the selectedMonth is 0
  if ($(this).hasClass('chevronLeft')) {
    var selectedMonth = $('#MonthName').val();
    (selectedMonth != 0) 
      ? $('#MonthName').val(selectedMonth - 1).trigger('change')
      : $('#MonthName').val(11).trigger('change');
  }

  else {
    // This doesn't work, I tried declaring the variable locally, 
    // different less/greater than expressions, but nothing works
    var selectedMonth = $('#MonthName').val();
    (selectedMonth !== 11)
      ? $('#MonthName').val(selectedMonth + 1).trigger('change')
      : $('#MonthName').val(0).trigger('change');
  }
});

$('#MonthName').on('change', function() {
   var monthText = 
    $('#MonthName option:selected').text();
    $('.theMonth').text(monthText);
});
4

3 回答 3

2

改变：

var selectedMonth = $('#MonthName').val();

到：

var selectedMonth = parseInt($('#MonthName').val(), 10);

selectedMonth + 1正在做字符串连接而不是整数加法，因为selectedMonth它是一个字符串。

小提琴

我还建议您指定的宽度theMonth-- 很难单击右箭头，因为它会随着月份的变化而不断移动。

于 2013-10-09T17:58:57.680 回答
0

那是因为您将一个 int 连接到一个字符串。

例如，做'1' + 1将等于11而不是2。在添加之前解析您的值：

$('#MonthName').val(parseInt(selectedMonth) + 1)

小提琴：http: //jsfiddle.net/mtJRn/21/

于 2013-10-09T17:59:18.710 回答
0

请注意，二月和十二月对应于 1 和 11，因此您不是添加数值而是连接字符串。

供您参考，这里有一个问题可能适合您的问题： 如何进行加法而不是串联

作为旁注，当我上小学时，我的老师曾经说过：

“你不能加苹果和梨。”

好吧，在 javascript 中你可以，因为它是弱类型的。

于 2013-10-09T18:03:06.377 回答