<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>日程安排</title>
<link rel="stylesheet" type="text/css" href="css/fullcalendar.css">
<style type="text/css">
#calendar{
width:960px;
margin:20px auto;
}
</style>
<script src='js/jquery-1.9.1.min.js'></script>
<script src='js/jquery-ui-1.10.2.custom.min.js'></script>
<script src='js/fullcalendar.min.js'></script>
<script type="text/javascript">
$(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#event').hide();
var calendar =$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable:true,//选择的时候高亮
select: function(start, end, allDay) { //选中某一日期触发事件
start = $.fullCalendar.formatDate(start,"yyyy-MM-dd HH:mm");
var end = $.fullCalendar.formatDate(end, 'yyyy-MM-dd HH:mm');
// $("#actionTime",window.opener.document).val(start);
// findFilm('t');
//$("#ticketMenuDiv").show();
//$("#returnButt").show();
//$("#timeList").hide();
},
buttonText:{
month:'月',
agendaWeek:'周',
agendaDay:'日',
today:'今天'
},
titleFormat:{
month:'yyyy年MMMM',
week:"yyyy年MMMd日{'—'[yyyy年][MMM]d日}",
day:'yyyy-MM-d dddd'
},
firstDay:1,//作用周视图，默认周几开始，0星期天，1星期一。。。。默认为0
editable: true,//可编辑
timeFormat: 'H:mm',//全部视图使用这个时间样式
axisFormat: 'H:mm',//agenda时间轴的格式
monthNamesShort:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
monthNames:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
dayNames:['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesShort:['周日','周一','周二','周三','周四','周五','周六'],
defaultEventMinutes:120,//如果事件没有结束时间，默认120分钟长度
unselectAuto:true,//是否清除高度选择的部分。默认为true
defaultView:'agendaWeek',//设置默认选中的为agendaWeek视图
dayClick: function(date, allDay, jsEvent, view) {//天 点击事件
//alert("日期："+date);
//alert($('#event').show());
window.showModalDialog('event.jsp', '添加日程事件', "dialogWidth:400px;dialogHeight:200px");
//window.showModalDialog('event.jsp', '添加日程事件', "dialogWidth:900px;dialogHeight:auto;edge:sunken;status:no;help:no;resizable:yes;scroll:no");
//window.open ('event.jsp', '添加日程事件', 'height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
//var selDate =$.fullCalendar.formatDate(date,'yyyy-MM-dd');//格式化日期
//$.fancybox({ //调用fancybox弹出层
// 'type':'ajax',
// 'href':'event.jsp?action=add&date='+selDate
//});
},
eventClick:function(){ //时间 点击事件
alert("针对点击的事件名称:");
//alert("针对javascript的事件:"+jsEvent.clientX);
//alert("视图名:"+view.name);
//window.open();
//if(event.url){//当点击事件的时候，如果时间有url属性，默认跳转到url,通过return false来阻止默认行为。
// window.open(event.url);
// return false;
//}
},
events: [
{
title: '全天计划\r\n#####\r\n写代码',
start: new Date(y, m, 1)
},
{
title: '张家界四日游',
start: new Date(y, m, d-5),
end: new Date(y, m, d-2)
},
{
title: '电话回访客户',
start: new Date(y, m, d-6, 16, 0),
allDay: false
},
{
title: '电话回访客户',
start: new Date(y, m, d+4, 16, 0),
allDay: false
},
{
title: '视频会议',
start: new Date(y, m, d, 10, 30),
allDay: false
},
{
title: '中秋放假',
start: '2013-09-19',
end: '2013-09-21'
},
{
title: '午饭',
start: new Date(y, m, d, 12, 0),
end: new Date(y, m, d, 14, 0)
},
{
title: '生日聚会',
start: new Date(y, m, d+1, 19, 0),
end: new Date(y, m, d+1, 22, 30)
},
{
title: '主页',
start: new Date(y, m, 28),
end: new Date(y, m, 29)
},
{
title: '实战训练课',
start: new Date(y, m, d+23)
}
]
});
});
</script>
</head>
<body>
<div id='event'>
<fieldset style=" width:300px">
<legend>新增日程</legend>
<form id="add_form" action="#" method="post">
<p>日程内容：<input type="text" class="input" name="event"></p>
<p><input type="submit" class="btn_ok" value="确定">
<input type="submit" class="btn_cancel" value="取消"></p>
</form>
</fieldset>
</div>
<div id='calendar'></div>
</body>
</html>
<html>
<head>
<title>日程安排</title>
<link rel="stylesheet" type="text/css" href="css/fullcalendar.css">
<style type="text/css">
#calendar{
width:960px;
margin:20px auto;
}
</style>
<script src='js/jquery-1.9.1.min.js'></script>
<script src='js/jquery-ui-1.10.2.custom.min.js'></script>
<script src='js/fullcalendar.min.js'></script>
<script type="text/javascript">
$(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#event').hide();
var calendar =$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable:true,//选择的时候高亮
select: function(start, end, allDay) { //选中某一日期触发事件
start = $.fullCalendar.formatDate(start,"yyyy-MM-dd HH:mm");
var end = $.fullCalendar.formatDate(end, 'yyyy-MM-dd HH:mm');
// $("#actionTime",window.opener.document).val(start);
// findFilm('t');
//$("#ticketMenuDiv").show();
//$("#returnButt").show();
//$("#timeList").hide();
},
buttonText:{
month:'月',
agendaWeek:'周',
agendaDay:'日',
today:'今天'
},
titleFormat:{
month:'yyyy年MMMM',
week:"yyyy年MMMd日{'—'[yyyy年][MMM]d日}",
day:'yyyy-MM-d dddd'
},
firstDay:1,//作用周视图，默认周几开始，0星期天，1星期一。。。。默认为0
editable: true,//可编辑
timeFormat: 'H:mm',//全部视图使用这个时间样式
axisFormat: 'H:mm',//agenda时间轴的格式
monthNamesShort:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
monthNames:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
dayNames:['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesShort:['周日','周一','周二','周三','周四','周五','周六'],
defaultEventMinutes:120,//如果事件没有结束时间，默认120分钟长度
unselectAuto:true,//是否清除高度选择的部分。默认为true
defaultView:'agendaWeek',//设置默认选中的为agendaWeek视图
dayClick: function(date, allDay, jsEvent, view) {//天 点击事件
//alert("日期："+date);
//alert($('#event').show());
window.showModalDialog('event.jsp', '添加日程事件', "dialogWidth:400px;dialogHeight:200px");
//window.showModalDialog('event.jsp', '添加日程事件', "dialogWidth:900px;dialogHeight:auto;edge:sunken;status:no;help:no;resizable:yes;scroll:no");
//window.open ('event.jsp', '添加日程事件', 'height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
//var selDate =$.fullCalendar.formatDate(date,'yyyy-MM-dd');//格式化日期
//$.fancybox({ //调用fancybox弹出层
// 'type':'ajax',
// 'href':'event.jsp?action=add&date='+selDate
//});
},
eventClick:function(){ //时间 点击事件
alert("针对点击的事件名称:");
//alert("针对javascript的事件:"+jsEvent.clientX);
//alert("视图名:"+view.name);
//window.open();
//if(event.url){//当点击事件的时候，如果时间有url属性，默认跳转到url,通过return false来阻止默认行为。
// window.open(event.url);
// return false;
//}
},
events: [
{
title: '全天计划\r\n#####\r\n写代码',
start: new Date(y, m, 1)
},
{
title: '张家界四日游',
start: new Date(y, m, d-5),
end: new Date(y, m, d-2)
},
{
title: '电话回访客户',
start: new Date(y, m, d-6, 16, 0),
allDay: false
},
{
title: '电话回访客户',
start: new Date(y, m, d+4, 16, 0),
allDay: false
},
{
title: '视频会议',
start: new Date(y, m, d, 10, 30),
allDay: false
},
{
title: '中秋放假',
start: '2013-09-19',
end: '2013-09-21'
},
{
title: '午饭',
start: new Date(y, m, d, 12, 0),
end: new Date(y, m, d, 14, 0)
},
{
title: '生日聚会',
start: new Date(y, m, d+1, 19, 0),
end: new Date(y, m, d+1, 22, 30)
},
{
title: '主页',
start: new Date(y, m, 28),
end: new Date(y, m, 29)
},
{
title: '实战训练课',
start: new Date(y, m, d+23)
}
]
});
});
</script>
</head>
<body>
<div id='event'>
<fieldset style=" width:300px">
<legend>新增日程</legend>
<form id="add_form" action="#" method="post">
<p>日程内容：<input type="text" class="input" name="event"></p>
<p><input type="submit" class="btn_ok" value="确定">
<input type="submit" class="btn_cancel" value="取消"></p>
</form>
</fieldset>
</div>
<div id='calendar'></div>
</body>
</html>
348
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
