JS日程管理插件FullCalendar中文说明文档

JS日程管理插件FullCalendar提供了丰富的属性设置和方法调用,开发者可以根据FullCalendar提供的API快速完成一个日历日程的开发,本文将FullCalendar的常用属性和方法、回调函数等整理成中文文档,以供参阅

普通显示设置

属性   描述   默认值  
header   设置日历头部信息。
如果设置为false,则不显示头部信息。包括left,center,right左中右三个位置,每个位置都可以对应以下不同的配置:
title: 显示当前月份/周/日信息
prev: 用于切换到上一月/周/日视图的按钮
next: 用于切换到下一月/周/日视图的按钮
prevYear:用于切换到上一年视图的按钮
nextYear:用于切换到下一年视图的按钮
  {
left: 'title',
center: '',
right: 'today prev,next'
}
 
theme   是否允许使用jquery的ui主题,如果设置为true,则需要加载jQuery ui相关css和js文件。   false  
buttonIcons   设置header中使用的prev, next等变量对应按钮的样式,只有当theme为true时才有效,如果你调用了jQuery ui样式但又不想使用它的图标样式,可以将此属性设置为false   { prev: 'circle-triangle-w', next: 'circle-triangle-e' }  
firstDay   设置一周中显示的第一天是哪天,周日是0,周一是1,类推。   0  
isRTL   设置为ture时则日历从右往左显示,貌似是针对阿拉伯人设计的。   false  
weekends   是否显示周末,设为false则不显示周六和周日。   true  
hiddenDays   隐藏一周中的某一天或某几天,数组形式,如隐藏周二和周五:[2,5],默认不隐藏,除非weekends设置为false。   []  
weekMode   在月视图里显示周的模式,因为每月周数可能不同,所以月视图高度不一定。
fixed:固定显示6周高,日历高度保持不变
liquid:不固定周数,高度随周数变化
variable:不固定周数,但高度固定
  'fixed'  
weekNumbers   是否在日历中显示周次(一年中的第几周),如果设置为true,则会在月视图的左侧、周视图和日视图的左上角显示周数。   false  
weekNumberCalculation   周次的显示格式。   "iso"  
height   设置日历的高度,包括header日历头部,默认未设置,高度根据aspectRatio值自适应。    
contentHeight   设置日历主体内容的高度,不包括header部分,默认未设置,高度根据aspectRatio值自适应。    
aspectRatio   设置日历单元格宽度与高度的比例。   1.35  
handleWindowResize   是否随浏览器窗口大小变化而自动变化。   true  
windowResize   callback,当浏览器窗口变化时触发function,使用:
$('#calendar').fullCalendar({
windowResize: function(view) {
alert('The calendar has adjusted to a window resize');
}
});
 
render   method,绑定日历到id上。
$('#id').fullCalendar('render');
 
destroy   method,销毁id日历,把日历回复到初始化前状态。
$('#id').fullCalendar('destroy');
 

视图

FullCalendar提供五种可用视图,包括month(月视图),basicWeek(基本周视图,左侧不显示具体时间),basicDay(基本日视图,左侧不显示具体时间),agendaWeek(周视图),agendaDay(日视图)。

View视图对象的属性:

属性   描述  
name   包括month,basicWeek,basicDay,agendaWeek,agendaDay  
title   标题内容(例如"2013年9月" or "Sep 7 - 13 2013")  
start   Date类型, 该view下的第一天  
end   Date类型, 该view下的最后一天. 由于是一个闭合的值, 所以, 比如在month view下, 10月这个月份, 那么end对应的应该是11月的第一天  
visStart   Date类型. 在该view下第一个可以访问的day. month view下, 该值是当月的第一天, week view下, 则通常和start一致  
visEnd   Date类型, 最后一个可访问的day  

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwgxwy.html