我试图在 Fomantic Calendar Widget 中显示接下来的 30 天。此外，我只使用 Fomantic 的日历小部件，而其他使用语义 ui。不幸的是，它只显示当前月份。
到目前为止，这就是我实现它的方式：
...
<head>
<link rel="stylesheet" type="text/css" href="/static/semantic/semantic.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="/static/semantic/semantic.min.js"></script>
<link rel="stylesheet" type="text/css" href="/static/semantic/floating.css">
<link rel="stylesheet" type="text/css" href="/static/semantic/components/calendar.css">
</head>
<body>
...
<div class="ui calendar" id="inline_calendar">
</div>
JS是：
<script>
var today = new Date();
$(document).ready(function(){
$('#inline_calendar').calendar(
{
minDate: new Date(today.getFullYear(), today.getMonth(), today.getDate()),
maxDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 14),
disabledDaysOfWeek: [7],
type: 'date',
multiMonth: true,
ampm: false,
formatter: {
date: function (date, settings) {
if (!date) return '';
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
return 'slot/' + year + '/' + month + '/' + day + '/';
}
},
onChange: function (date, text) {
var newValue = text;
window.location.replace('/booking/'+newValue)
},
}
);
});
</script>
<script src="/semantic/components/calendar.js"></script>
这将导致以下结果，而不是显示接下来的 30 天：
