FullCalendar 日历控件

FullCalendar 日历控件

http://arshaw.com/fullcalendar/

比较好用,

<script type='text/javascript'>

	$(document).ready(function() {
	
		var date = new Date();
		var d = date.getDate();
		var m = date.getMonth();
		var y = date.getFullYear();
		
		$('#calendar').fullCalendar({
					header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
minTime:6, //天开始小时
			editable: true, //是否可以拖动
			dayClick: function(date, allDay, jsEvent, view) { //日期点击事件
		    if (allDay) {
		      alert('Clicked on the entire day: ' + date);
		    }else{
		      alert('Clicked on the slot: ' + date);
		    }
		
		    alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
		
		    alert('Current view: ' + view.name);
		
		    // change the day's background color just for fun
		    $(this).css('background-color', 'red');
  },
    eventClick: function(calEvent, jsEvent, view) { //事件 点击事件

    alert('Event: ' + calEvent.title);
    alert('ID ' + calEvent.id);
    alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
    alert('View: ' + view.name);

    // change the border color just for fun
    $(this).css('border-color', 'red');

  },
  events: [ //所有事件
				{id: 1,

					title: 'All Day Event',
					start: new Date(y, m, 1),
					 color: 'black',   // an option!
     			 textColor: 'yellow'		
     		},
				{id: 2,

					title: 'Long Event',
					start: new Date(y, m, d-5),
					end: new Date(y, m, d-2)
				},
				{
					id: 3,
					title: 'Repeating Event',
					start: new Date(y, m, d-3, 16, 0),
					allDay: false
				},
				{
					id: 4,
					title: 'Repeating Event',
					start: new Date(y, m, d+4, 16, 0),
					allDay: false
				},
				{id: 5,
					title: '下午,竞园-M1,史丽佳,已结束',
					start: '2011-10-18 11:00',
					end:'2011-10-18 17:00',
					allDay: false
				},
				{id: 6,

					title: 'Lunch',
					start: '2011-10-18 11:00',
					end: new Date(y, m, d, 14, 0),
					allDay: false
				},
				{id: 7,

					title: 'Birthday Party',
					start: new Date(y, m, d+1, 19, 0),
					end: new Date(y, m, d+1, 22, 30),
					allDay: false
				},
				{id: 8,

					title: 'Click for Google',
					start: new Date(y, m, 28),
					end: new Date(y, m, 29),
					url: 'http://google.com/'
				}
			]
		});
		
	});

</script>