Question

我正在尝试将 Zabuto日历添加到我的网站。有没有办法设置最小和最大日期，类似于jQuery Datepicker的工作方式？

例如，使用jQuery日期选择器，您可以将其设置为具有最小和最大日期，并且不在这两个日期之间的任何日期将显示为灰色并禁用。

$("#datepicker").datepicker("option", "minDate", date);
$("#datepicker").datepicker("option", "maxDate", date2);

我找不到任何具有类似功能的 Zabuto日历的文档。

能够做到吗？

Answer 1

虽然我的回答很晚，但是我遇到了问题而我没有在网上找到回答这个问题的来源。仅添加show_next属性以及预先显示的月数。

$("#my-calendar").zabuto_calendar({
      action: function() { myDateFunction(); },
        show_previous: 1, // Will show 1 month back
        show_next: 3,     // Will show 3 months in advance
});

Answer 2

根据 official website ，您可以同时使用show_previous和show_next参数的limit months navigation。

// initialize the calendar on ready
$("#my-calendar").zabuto_calendar({
  today: true,
  cell_border: true,
  weekstartson: 0,
  nav_icon: {
    prev: '<i class="fa fa-chevron-circle-left"></i>',
    next: '<i class="fa fa-chevron-circle-right"></i>'
  },
  // limit months navigation to a specific range
  show_previous: 2,
  show_next: 2
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/zabuto_calendar/1.6.3/zabuto_calendar.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/zabuto_calendar/1.6.3/zabuto_calendar.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" />
<div id="my-calendar"></div>

zabuto日历最小和最大日期

2 个答案: