我面临一个问题。使用 Jquery 集成完整日历时出现以下错误。
Uncaught TypeError: a.isValid is not a function
at X (moment.min.js:6)
at String.kc (moment.min.js:6)
at e (fullcalendar.min.js:6)
at d (fullcalendar.min.js:7)
at c (fullcalendar.min.js:7)
at Object.t [as formatDate] (fullcalendar.min.js:6)
at HTMLDocument.<anonymous> (cal.html:15)
at j (jquery.min.js:2)
at k (jquery.min.js:2)
我在下面解释我的代码。
<!DOCTYPE html>
<html>
<head>
<title>jQuery Fullcalendar Integration with example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.3.0/fullcalendar.min.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.3.0/fullcalendar.print.css" rel="stylesheet" media="print" />
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.3.0/fullcalendar.min.js"></script>
</head>
<body>
<div id="calendar"></div>
<script type="text/javascript">
$(document).ready(function(){
var st=$.fullCalendar.formatDate('2018-01-03', "yyyy-MM-dd H:mm:ss");
var end=$.fullCalendar.formatDate('2018-01-05', "yyyy-MM-dd H:mm:ss");
var calendar = $("#calendar").fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listWeek'
},
navLinks: true,
editable: true,
eventLimit: true,
events: [
{
title : 'event1',
start : '2017-04-01'
},
{
title : 'event2',
start : st,
end : end
},
{
title : 'event3',
start : '2017-04-09T12:30:00',
allDay : false // will make the time show
}
], // request to load current events
});
});
</script>
</body>
</html>
在这里，实际上我需要显示event barstart date to end date (i.e-'2018-01-03' and '2018-01-05')但它显示了上述错误。请帮助我解决此错误。
看起来这是变量的问题。与其对他们使用完整日历，不如使用Moment JS。
因此，您应该能够将它们更改为：
var st = moment().format('2018-01-03', "yyyy-MM-dd H:mm:ss");
var end = moment().format('2018-01-06', "yyyy-MM-dd H:mm:ss");
更新了结束日期设置为加 1 天，以显示正确的日期。
这些语句：
var st=$.fullCalendar.formatDate('2018-01-03', "yyyy-MM-dd H:mm:ss");
var end=$.fullCalendar.formatDate('2018-01-05', "yyyy-MM-dd H:mm:ss");
不工作。此函数在 fullCalendar 中不再是最新的，它在 v2.0 中被删除。它似乎仍然可以调用它，但它不再被记录，你不应该期望它以任何可预测或正确的方式工作。
即使它确实有效，您对它的使用也是多余的，因为您要求将字符串格式化为与它已经完全相同的格式(H:mm:ss部分无关紧要，因为您的日期字符串没有时间部分，因此也不会输出时间字符串)。
当前在fullCalendar中执行此操作的方法(var st = moment().format('2018-01-03', "yyyy-MM-dd H:mm:ss");- 见 https://fullcalendar.io/docs/utilities/Moment/)也生成简单的2018-01-03- 与输入相同。根本不需要使用它。
相反，您可以直接在事件中指定时间：
{
title : 'event2',
start : "2018-01-03",
end : "2018-01-05"
}
这是可能的，因为fullCalendar接受momentJS接受的任何日期 - 包括ISO字符串，本机JS日期对象等。
关于您在另一个问题的评论中提到的次要问题，您的日期不会出现在日历中的 1 月 5 日，因为结束日期是排他性的(见 https://fullcalendar.io/docs/event_data/Event_Object/)。您的活动在 5 日开始时结束，而不是结束。如果要使其显示在星期五，只需在结束日期(2018-01-06)中添加一天即可。