关于javascript：如何在完整日历插件中禁用上个月

how to disable previous month in Full Calendar Plugin

我想从全部日历中禁用上个月的按钮

当前月份为四月。当我单击上一个按钮时，日历显示上一个三月月。不应该发生。

http://jsfiddle.net/6enYL/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

$(document).ready(function () {

var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();

var calendar = $('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title'
},
selectable: true,
selectHelper: true,
editable: true
});

});

相关讨论

禁用过去的日期，从今天开始查看

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

$('#calendar').fullCalendar({
defaultView: 'agendaWeek',
firstDay :moment().weekday(),
viewRender: function(currentView){
var minDate = moment();
// Past
if (minDate >= currentView.start && minDate <= currentView.end) {
$(".fc-prev-button").prop('disabled', true);
$(".fc-prev-button").addClass('fc-state-disabled');
}
else {
$(".fc-prev-button").removeClass('fc-state-disabled');
$(".fc-prev-button").prop('disabled', false);
}

}
});

FullCalendar与传统的DatePicker不同。无法初步设置要显示的内容的开始和结束日期。

您必须附加到viewRender事件并使用自己的逻辑来操作日历。因此，如果日期少于您想要的日期，则可以将一个类附加到该"禁用"磁贴上。并禁用您自己的上一个按钮。然后，您还必须在下个月重新启用上一个按钮。借助这种API，您可以构建自己的自定义日历，但是这可能会花费一些时间。

FullCalendar只是一个日历。其余的取决于您。

这是基于Prasad19sara答案的更新：http://jsfiddle.net/6enYL/2/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

请注意，不建议使用viewDisplay，并且将不再在V2中使用

如果您正在寻找更新的解决方案(与v4兼容)，请寻找validRange

请参阅文档：https://fullcalendar.io/docs/validRange

1
2
3
4
5

header:{
left: 'title',
center: '',
right: 'today prev,next'
},

只需删除"上一个" ... http://fullcalendar.io/docs/display/header/
在您的选择中

对于使用FullCalendar.io版本2的用户，可以使用以下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

viewRender: function(view) {
\tvar now = new Date();
\tvar end = new Date();
\tend.setMonth(now.getMonth() + 1);
\t
\t
\tvar cal_date_string = view.start.format('MM')+'/'+view.start.format('YYYY');
\tvar cur_date_string = now.getMonth()+'/'+now.getFullYear();
\tvar end_date_string = end.getMonth()+'/'+end.getFullYear();

\tif(cal_date_string == cur_date_string) { jQuery('.fc-prev-button').addClass("fc-state-disabled"); }
\telse { jQuery('.fc-prev-button').removeClass("fc-state-disabled"); }

\tif(end_date_string == cal_date_string) { jQuery('.fc-next-button').addClass("fc-state-disabled"); }
\telse { jQuery('.fc-next-button').removeClass("fc-state-disabled"); }
},

这是我的简单解决方案。

将此代码放在ignoreWindowResize--之前的renderView函数(版本1.5.4中，第368行)中。在函数末尾附近。

1
2
3
4
5
6
7

var lammCurrentDate = new Date();
var lammMinDate = new Date( lammCurrentDate.getFullYear(), lammCurrentDate.getMonth(), 1, 0, 0, 0, 0);
if (currentView.start <= lammMinDate){
header.disableButton('prev');
} else {
header.enableButton('prev');
}