fullcalendar显示出勤日_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一