fullCalendar中文API官方文档(4)

 9.6. eventClick, eventMouseover, eventMouseout: function(calEvent, jsEvent, view): 日程事件被点击, 鼠标划过, 鼠标离开的事件. 参数和上面介绍过的同名参数一致. 这里的eventClick事件如果返回false, 可以阻止浏览器跳转到对应日程事件在初始配置时指定的url地址. 这种事件的阻止传播可以参照DHTML文档关于事件的传播和原始响应.

 9.7. eventDragStart, eventDragStop: function(calEvent, jsEvent, ui, view)日程事件被拖动之前和之后触发. 这里的拖动不一定是一个有效的拖动, 只要日程事件的控件被拖着动了, 事件就触发. 同名参数和上面介绍过的一样. UI保存的是一个JQuery的UI对象. 可以从该对象中获取位移, 位置等数据.

 9.8. eventDrop: function(calEvent, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) 在一个日程事件被移动, 并成功移动到另外一个日期/时间.

  9.8.1. dayDelta: 保存了这次拖动导致该日程事件移动了多少天, 向前为正数, 向后为负数.

  9.8.2. minuteDelta: 保存了这次拖动导致该日程事件移动了多少分钟, 向前为正数, 向后为负数. 该值只有在agenda view下有效.

  9.8.3. allDay: 如果在month view下移动, 或在agenda view下移动到all-day区域, 则allDay为true, 移动到agenda view的其他区域则为false

  9.8.4. revertFunc: 调用该方法, 可以将刚才的拖动恢复到原状. 这个方法多用于ajax的提交, 移动之后, 提交数据到后台, 如果后台更新失败, 根据返回消息, 调用这个方法, 可以使页面回复原状.

  9.8.5. eventResizeStart, eventResizeStop: function(calEvent, jsEvent, ui, view): 在一个日程事件改变大小之前之后发生(不一定要改变成功.) calEvent保存了日程事件信息(date, title, 等等)

  9.8.6. eventResize: function(calEvent, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view): 在日程事件改变大小并成功后调用, 参数和eventDrop参数用法一致.

10. View 对象

 10.1. name: 前面列举的那些view名称

 10.2. title: string: 切换到view的时候, 可以在header中设置的title变量的值.

 10.3. start: Date类型, 该view下的第一天.

 10.4. end: Date类型, 该view下的最后一天. 由于是一个闭合的值, 所以, 比如在month view下, 10月这个月份, 那么end对应的应该是11月的第一天.

 10.5. visStart: Date类型. 在该view下第一个可以访问的day. month view下, 该值是当月的第一天, week view下, 则通常和start一致.

 10.6. visEnd: Date类型, 最后一个可访问的day

11. 颜色的修改: 通过重写css实现

 11.1. 示例一:

.fc-event, .fc-agenda .fc-event-time, .fc-event a { background-color: black; /* background color */ border-color: black; /* border color (often same as background-color) */ color: red; /* text color */ }

 11.2. 示例二

.holiday, .fc-agenda .holiday .fc-event-time, .holiday a { background-color: green; /* background color */ border-color: green; /* border color (often same as background-color) */ color: yellow; /* text color */ }

12. 主题, 使用jquery ui提供的主题

 12.1. theme: Boolean, 默认false, 设置为true, 允许使用jquery的ui主题

 12.2. buttonIcons: Object, 改变header中使用的prev, next等变量对应按钮的样式, 默认的样式是:

{ prev: 'circle-triangle-w', next: 'circle-triangle-e' }

13. 本地化选项:

 13.1. firstDay: Integer类型, 默认值0. 一周中显示的第一天是哪天. 星期天是0, 星期一是1, 类推.

 13.2. monthNames: Array, 月份全名使用的字符串, 默认是英文的月份名称全称.

 13.3. monthNamesShort: Array, 月份简写使用的字符串, 默认是英文月份名称简写

 13.4. dayNames: Array, 星期的全名使用的字符串, 默认是英文的星期的名称全称.

 13.5. dayNamesShort: Array, 星期的简写使用的字符串, 默认是英文星期的名称简写

 13.6. buttonText和allDayText在最初的2.4和2.9部分已经介绍.

14. 日期工具

 14.1. 格式化日期: $.fullCalendar.formatDate(date, formatString[, options]), 通过指定的格式格式化一个日期, 返回一个字符串. options选项是一个对象, 其中设置本地化变量支持的属性值. 比如{ monthNames : [‘一月', ‘二月', ……], dayNames: [‘周日', ‘周一', …..]}

 14.2. 一次格式化两个日期: $.fullCalendar.formatDate(date1, date2, formatString[, options]): 和上一个格式化日期类似, 只不过, 这里在formatString中使用大括号{…}来描述第二个日期的格式化方式.

 14.3. 解析日期: $.fullCalendar.parseDate(string): 将一个字符串格式成一个javascript的Date对象, 这个string可以是ISO8601, IETF, UNIX时间戳三种格式.

 14.4. parseISO8601: $fullCalendar.parseISO8601(string[, ignoreTimezone]) 将一个ISO8601字符串转换成一个javascript 的Date对象.

15. 将日程和google的日程管理连接起来.

 15.1. 需要引入另外一个js文件: gcal.js

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

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