在jQuery Datepicker中获取导航月份的第一天和最后一天

时间:2018-07-10 14:34:42

标签: javascript jquery jquery-ui-datepicker

我正在使用jQuery UI datepicker。当我单击上一个和下一个箭头时,我想调用一个API并将经过导航的月份的第一天和最后一天作为日期传递。

例如如果我单击下一步转到2018年8月,则应该是8月的第一个和最后一个日期。

我已经知道了,但是onSelect。我想在上一个和下一个导航中获取它。

HTML:

<input type="text" id="date1" name="date1"/> 
<p id="date2"></p>

jQuery:

$('#date1').datepicker({
    onSelect: function(dateText, inst) { 
      var dateAsString = dateText; //the first parameter of this function
      var dateAsObject = $(this).datepicker( 'getDate' ); //the getDate method

      var firstDay = new Date(dateAsObject.getFullYear(), dateAsObject.getMonth(), 1);
      var lastDay = new Date(dateAsObject.getFullYear(), dateAsObject.getMonth() + 1, 0);

      $('#date2').html(firstDay+" <br/> "+lastDay); 
   }
});

选中JSFiddle

1 个答案:

答案 0 :(得分:0)

使用onChangeMonthYear代替使用onSelect

$('#date1').datepicker({

    onChangeMonthYear : function(dateText, inst, dateob) { 
      var dateAsString = dateText; 
      var dateAsObject = $(this).datepicker( 'getDate' ); 
      console.log(dateob.selectedDay +"/"+ dateob.selectedMonth +"/"+ dateob.selectedYear);
      var navidatedMonth = new Date(dateob.selectedYear, dateob.selectedMonth,  dateob.selectedDay)

     var firstDay = new Date(navidatedMonth.getFullYear(), navidatedMonth.getMonth(), 1);

      var lastDay = new Date(navidatedMonth.getFullYear(), navidatedMonth.getMonth() + 1, 0);

      $('#date2').html(firstDay + " <br/>" + lastDay); 

   }
});