每当我在 jquery UI 日期选择器中更改月份/年份时，如何获取该月的第一个日期和最后一个日期

how to get the first date and last date of the month whenever I change the month/year in jquery ui datepicker

本文关键字：日期 何获取 获取 最后一个 第一个 jquery UI 选择器      更新时间：2023-09-26

我使用 jquery-ui 多日期选择器创建了一个内联日历。每当我更改月份/年份时，我都想要一个月的第一个和最后一个日期（通过单击上一个/下一个按钮或从列表中选择某个月/年）

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>jQuery UI Datepicker functionality</title>
    <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
    <link rel="stylesheet prefetch" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css">
    <script src="http://code.jquery.com/jquery-2.1.4.js"></script>
    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script type="text/javascript" src="js/jquery-ui.multidatespicker.js"></script>
      
    <script>
      $(function() {
        var today = new Date();
        var yesterday = (new Date()).setDate(today.getDate()-1); 
        var tomorrow = (new Date()).setDate(today.getDate()+1);
        var dayAfttomorrow = (new Date()).setDate(today.getDate()+2);
        var dayDayAfttomorrow = (new Date()).setDate(today.getDate()+3);
        var dates = [yesterday, today, tomorrow, dayAfttomorrow, dayDayAfttomorrow];
        $('#calendar').multiDatesPicker({
          changeYear: true,
          changeMonth: true,
          disabled: false,
          addDates: dates,
          onSelect: function() {
            var date = $(this).datepicker('getDate');
            $('#calendar').multiDatesPicker('resetDates').multiDatesPicker('addDates', [date]);
          },
          onChangeMonthYear: function(){
            // alert("Hii, I'm here");
          }
        });
      });     
    </script>
    <style type="text/css">
      .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
        border: 1px solid #d3d3d3 !important;
        background: #3B8CC5 !important;
      }
      .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
        border: 1px solid #d3d3d3 !important;
      }
      .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        border: none !important;
      }
      /*.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        background: green;
      }*/
    </style>
  </head>
  <body>
    <!-- HTML --> 
    <div id="calendar"></div>
  </body>
</html>

在这里尝试 JavaScript 函数。我希望您可以在代码中使用它，只需在下面进行少量更改

 onChangeMonthYear: function(){
          // alert("Hii, I'm here");
 }
相关文章：