fullcalendar入门笔记

前段时间做了一个简单的页面需要用到fullcalendar，索性到官网上查看了文档，没有什么心得，只剩下这么点代码，以后有新的发现，会添加进来

function calender(){
            $("#calendar").fullCalendar({
                /* weekMode: 'variable', */
                /* columnFormat: {
                    month: 'dddd',
                    week: 'dddd M-d',
                    day: 'dddd M-d'
                }, */
                titleFormat:'MMMM YYYY', 
              /*monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
                monthNamesShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
                dayNames: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
                dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], */
                /* businessHours: {//工作日 工作时间
                    // days of week. an array of zero-based day of week integers (0=Sunday)
                    dow: [ 1, 2, 3, 4, 5 ], // Monday - Thursday

                    start: '9:00', // a start time (10am in this example)
                    end: '18:00', // an end time (6pm in this example)
                }, */
                header: {
                    left: 'month,agendaWeek,agendaDay',
                    center: 'title',
                    right: 'today prev,next'
                },
                
                weekNumbers:true,//确定周数是否应显示在日历上。
                weekNumbersWithinDays:true,//确定月视图中的星期编号和基本视图的样式。 */
                showNonCurrentDates:false,//在月视图下，是否应该在上一个月或下个月的日期。
                /* contentHeight: 600, *///将使日历的内容区域成为像素高度。
                /* handleWindowResize:true,//是否在浏览器窗口调整大小时自动调整日历大小。 */
                defaultDate:new Date(),/*默认日期*/ 
                navLinks: true, // can click day/week names to navigate views
                editable: false,
                eventLimit: true, // 限制一天中显示的事件数。
                /* dayPopoverFormat:'dddd, MMMM D', *///确定由eventLimitClick选项创建的popover的标题的日期格式。
                /* columnFormat:'dddd', */
                
                     views: {
                            basic: {
                                titleFormat:'MMMM YYYY', // options apply to basicWeek and basicDay views
                            },
                            agenda: {
                                titleFormat:'MMMM  YYYY',// options apply to agendaWeek and agendaDay views
                            },
                            week: {
                                titleFormat:'MMMM YYYY',// options apply to basicWeek and agendaWeek views
                            },
                            day: {
                                titleFormat:'MMMM d,YYYY',// options apply to basicDay and agendaDay views
                            }
                     },
                events: {  
                    url: "showDate.action",
                    type: 'POST',
                    success:function(data){
                        if(data=="9"){
                            window.location.href="/YKD/heal/index.html";
                        }
                    },
                    error: function() {  
                        alert('there was an error while fetching events!');  
                    },  
                    color:'#3A87AD',// 背景色  
                    textColor:'white'// 文字颜色  
                }  
            });
    }

下面的代码是我添加了一个下拉框，用来控制日历中显示的事件

$('#selc').change( function(){
              var events = {
               url: "showDate.action",
               type: "POST",
               data: {
                "divcode": $(this).val()
               },
              success:function(data){
                    if(data=="9"){
                        window.location.href="/YKD/heal/index.html";
                    }
              }
              };
              $('#calendar').fullCalendar( 'removeEventSource', events);
              $('#calendar').fullCalendar( 'addEventSource', events);   
              $('#calendar').fullCalendar( 'refetchEvents' );
             }).change();

因为有些代码要删除，所以要保存起来又容易查看，就把它记录在这里。第一次写博客，不足之处还望见谅。以后会改进的