jquery日历插件FullCalendar使用技巧

<script type="text/javascript" src="http://t.zoukankan.com/js/jquery-1.10.2.min.js"></script>
<script type="text/JavaScript" src="http://t.zoukankan.com/js/jQuery-ui-1.10.3.custom.min.js"></script>
<script type="text/javascript" src="http://t.zoukankan.com/js/fullcalendar.min.js"></script>

$(function(){
$('#calenderDemo').fullCalendar({});
});

$('#calenderDemo').fullCalendar({
header:{
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
}
});

$('#calenderDemo').fullCalendar({
buttonText: {
today: '今天',
month: '月',
week: '周',
day: '天'
},
allDayText: '全天',
monthNames: ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
monthNamesShort: ['1','2','3','4','5','6','7','8','9','10','11','12'],
dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
});

$('#calenderDemo').fullCalendar({
events:[]
});

events: [
{
title: 'All Day Event',
start: new Date()
},
{
title: 'Long Event',
start: new Date(),
end: new Date(new Date().getTime()+86400000)
}
]

events: {
url: '/myfeed.PHP',
type: 'POST',
data: {
custom_param1: 'something',
custom_param2: 'somethingelse'
},
error: function() {
alert('there was an error while fetching events!');
},
color: 'yellow', // a non-ajax option
textColor: 'black' // a non-ajax option
}

events: function(start, end, callback) {
// 取得日程数据后回调
callback(events);
}

var calendar = $('#calenderDemo').fullCalendar({
dayClick: function(date, allDay, jsEvent, view) {
// 此处可以进行弹窗、后台通信等处理
// 本例仅在日历中添加一个新日程
calendar.fullCalendar('renderEvent',
{
title: '日程' + new Date().getTime(),
start: date,
allDay: allDay
}
);
}
});

var calendar = $('#calenderDemo').fullCalendar({
eventClick : function(event, jsEvent, view) {
// 此处可添加修改日程的代码
var red = Math.round(255 * Math.random());
var green = Math.round(255 * Math.random());
var blue = Math.round(255 * Math.random());
$(this).css('background-color', 'rgb(' + red + ',' + green + ',' + blue + ')');
}
});

var calendar = $('#calenderDemo').fullCalendar({
editable : true,
eventDrop : function(event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) {
// 拖动某个日程到新位置时，日程时间改变，此处可做相关处理
}
});

var calendar = $('#calenderDemo').fullCalendar({
editable : true,
eventResize : function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
// 改变某个日程大小，日程结束时间改变，此处可做相关处理
}
});

var calendar = $('#calenderDemo').fullCalendar({
selectable : true,
select : function(startDate, endDate, allDay, jsEvent, view) {
// 选中一段日期，此处可做相关处理
// 处理完成后，取消选中状态
calendar.fullCalendar('unselect');
}
});