fullcalendar3.0版本使用方法

引入样式表、js及汉化js

//依赖于jq因此需先引入jq
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<link href="https://cdn.bootcdn.net/ajax/libs/fullcalendar/3.10.0/fullcalendar.css" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/fullcalendar/3.10.0/fullcalendar.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/fullcalendar/3.10.0/locale-all.js"></script>

使用

jQuery(function($) {
		// 组件初始化
		$('#calendar').fullCalendar({
			// 自定义按钮
			customButtons: {
				myCustomButton: {
				text: '按钮展示称',
				click: function() {
					// 数据还原
					chosen_update_value($("#dialog-message").find('#anchor'),'') //chosen框赋值更新
					chosen_update_value($("#dialog-message").find('#anchor_level'),'') //chosen框赋值更新
					$("#dialog-message").find('#start_date').val('')
					$("#dialog-message").find('#end_date').val('')
					$("#dialog-message").find('#start_time').val('')
					$("#dialog-message").find('#end_time').val('')
						openDdialog('add')
					}
				}
			},
			// 头部导航
			header:{
				left: 'month,basicWeek myCustomButton',
				center: 'title',
				right: 'today prev,next'
			},
			// 日历配置部分
			locale: 'zh-cn',   //配置语言
			firstDay: 1, 
			timezone: 'local',//时区
			displayEventEnd: true, //所有视图显示结束时间
			editable: true,
			// 开启更多链接/
			eventLimit: true,
			eventLimitText:"更多",
			dayMaxEvents: true, 
			contentHeight:750, //设置日历主体内容的高度，不包括header部分，默认未设置，高度根据aspectRatio值自适应。
			aspectRatio:1.5,//设置日历单元格宽度与高度的比例。
			editable : false,// 不允许拖动
			eventClick: function(event) {
				//单击已有日程安排
			},
			/*
			方法一:
			events: [
                    {
                      title: 'Business Lunch',
                      start: '2020-09-03T13:00:00',
                      constraint: 'businessHours'
                    },
                    {
                      title: 'Meeting',
                      start: '2020-09-13T11:00:00',
                      constraint: 'availableForMeeting', // defined below
                      color: '#257e4a'
                    },
                    {
                      title: 'Conference',
                      start: '2020-09-18',
                      end: '2020-09-20'
                    },
                    {
                      title: 'Party',
                      start: '2020-09-29T20:00:00'
                    },

                    // areas where "Meeting" must be dropped
                    {
                      groupId: 'availableForMeeting',
                      start: '2020-09-11T10:00:00',
                      end: '2020-09-11T16:00:00',
                      display: 'background'
                    },
                    {
                      groupId: 'availableForMeeting',
                      start: '2020-09-13T10:00:00',
                      end: '2020-09-13T16:00:00',
                      display: 'background'
                    },

                    // red areas where no events can be dropped
                    {
                      start: '2020-09-24',
                      end: '2020-09-28',
                      overlap: false,
                      display: 'background',
                      color: '#ff9f89'
                    },
                    {
                      start: '2020-09-06',
                      end: '2020-09-08',
                      overlap: false,
                      display: 'background',
                      color: '#ff9f89'
                    }
                  ]
			*/
			//方法二：动态获取日程数据适用于ajax动态
			events: function(start, end, timezone, callback) {
				$.ajax({
					url:"XXXXX",
					type : "POST",
					//下面的startDate必须用单引号，不能用双引号
					data: {'startDate':dateFormat(start._d),'endDate':dateFormat(end._d),anchor_id},
					cache:false,
					dataType: "json",
					success:function(data){
						// 初始化主播排期历程
						var events=[];
						if(data.rec_info.length){
							for(var i=0;i<data.rec_info.length;i++){
								events.push({
									id:data.rec_info[i].anchor_schedule_times_id,
									title:data.rec_info[i].name,
									start:data.rec_info[i].start_date +' '+ data.rec_info[i].start_time,
									end:data.rec_info[i].end_date+' '+data.rec_info[i].end_time,
								});
							}
						}
						callback(events); //将数组回调给enents
					},
				}); 
			},
			dayClick:function(event){
				//单击单元格所需要做的事情
			},
		});	

	})
	// 格式化日期   返回yyyy-mm-dd hh：mm：ss
	function formatDate(date) {   //格式化日期函数
		var d = new Date(date),
		month = '' + (d.getMonth() + 1),
		day = '' + d.getDate(),
		year = d.getFullYear();                 
		if (month.length < 2) 
			month = '0' + month;
		if (day.length < 2) 
			day = '0' + day;                 
		return [year, month, day].join('-');
	}

重新渲染数据

$('#calendar').fullCalendar('refetchEvents')