jsp页面
<!--显示fullCalendar的层-->
<div id='calendar'></div>
js方法
//初始化fullCalendar组件
$('#calendar').fullCalendar({//头部左、中、右内容设定
header: {
left: 'today prev next ',
center: 'title',
right:''
},
//设置“上一个”、“下一个”按钮显示的样式
buttonIcons:{
prev: 'left-double-arrow',
next: 'right-double-arrow'
},
//标灰周六、周日底色
businessHours: true,
//设置每周的第一天显示0代表周日、1代表周一......
firstDay:1,
//设置是否显示周六、周日在日历上
weekends:true,
//设置是否显示本周在本年度的计数
weekNumbers:true,
//设置日历的整体高度
height:650,
//设置每天显示的日程的数量
eventLimit:4,
//设置日历是否可被编辑
editable: false,
//后台获取JSON的文件,其主要目的是根据数据库产生相应的Event对象。当在这里约定后台文件时, fullCalendar自动默认通过GET的方式传递三个参数1)start 2)end 3)_
events:"/train/trainMatrixController/getTrainByTime.action",
//*********************************************************//
//*******************FullCalendar事件处理*******************//
//*********************************************************//
//监听鼠标飘过Event事件
eventMouseover: function(calEvent, jsEvent, view){
//显示Event详情的层
$('#details').css("visibility","visible");
//传递给需要显示的event数据。只要是通过后台传给fullCalendar的数据均可以通过calEvent的实例获取。
$('#details').html(calEvent.title+"<br>"+calEvent.url+"<br>"+calEvent.color);
},
//监听鼠标飘出Event事件
eventMouseout: function(calEvent, jsEvent, view){
//隐藏Event详情的层
$('#details').css("visibility","hidden");
},
//监听Event被点击事件
eventClick: function(calEvent, jsEvent, view) {
if(calEvent.url!=null){
// alert("跳转啦"+calEvent.url);
window.open(calEvent.url);
return false;
}
else
{
alert("没有URL传入,跳不了啊!");
}
}
})