我正在尝试使用带有 rrule.js 的 FullCalendar 4.3.1 使用脚本标签。根据[https://fullcalendar.io/docs/rrule 插件][1]：
"如果你使用标签和浏览器全局变量，你必须确保 来自 rrule 站点的原始非插件 rrule.js dist 文件是 首先包含在您的页面上。
我已经做到了。在我的日历初始化JS中，我有：
/*js/myCalendar4.js*/
$(
function(e) {
var calendarEl = document.getElementById('calendar');
_parentCalendar = new FullCalendar.Calendar(calendarEl,
{
plugins : ['interaction','dayGrid', 'timeGrid', 'rrule'],
selectable : true,
header : {
left :'prevYear, prev',
center :'title',
right :'today, next, nextYear'
},
dateClick : function(dInfo) {
swal({
title : "Calendar Date Click",
text : dInfo.dateStr,
icon : "info"
});
},
select : function(dInfo) {
swal({
title : "Calendar Date Selection",
text : dInfo.startStr + " to " + dInfo.endStr,
icon : "info"
});
},
eventClick : eventClickHandler,
eventDrop : eventDropHandler,
defaultView : 'dayGridMonth',
weekends : true,
timeZone : 'America/New_York',
eventLimit : true,
eventLimitText : "hidden events",
events : [
{
title: 'My RRule Recurring Event',
rrule:'DTSTART:2019-10-29T05:30;FREQ=DAILY;INTERVAL=1;COUNT=5',
duration : '10:00'
}
],
loading : function(isLoading) {
if (isLoading) {
calBlock("Loading calendar events ...");
}
else {
calUnblock();
}
},
eventRender : function(eventInfo) {
console.log("Rendered Info: ", eventInfo);
}
}
);
_parentCalendar.render();
}
);
function calBlock(messageText) {
$("body").block({message: messageText});
}
function calUnblock() {
$("body").unblock();
}
function failureMethod(x) {
calUnblock();
swal({
title : "Calendar Retrieval Error!",
text : x.message + "!",
icon : "error"
});
}
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="cache-control" content="no-cache">
<title>FullCalendar 4.3.1</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="images/favicon.png"/>
<script type="text/javascript" src="/webtools/JSCentral/JQuery/jquery-1.10.2.min.js"></script>
<script src="js/moment.js"></script>
<script src="js/fullcalendar/4.3.1/packages/core/main.js"></script>
<script src="js/fullcalendar/4.3.1/packages/daygrid/main.js"></script>
<script src="js/fullcalendar/4.3.1/packages/timegrid/main.js"></script>
<script src="js/fullcalendar/4.3.1/packages/interaction/main.js"></script>
<script src="js/fullcalendar/4.3.1/packages/rrule/main.js"></script>
<script src="js/rrule/rrule.js"></script>
<script src="js/sweet-alert/sweet-alert.min.js"></script>
<script src="js/myCalendar4.js"></script>
<script src="js/calendar4_action_handlers.js"></script>
<script type="text/javascript" src="js/blockUI.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap-datepicker.css">
<link rel="stylesheet" type="text/css" href="css/sweet-alert2.css">
<link rel="stylesheet" type="text/css" href="/webtools/JSCentral/JQuery/jquery-ui-1.9.1.custom/css/smoothness/jquery-ui-1.9.1.custom.css">
<link rel="stylesheet" type="text/css" href="css/foundation.min.css">
<link rel="stylesheet" type="text/css" href="css/balloon-tooltip.css">
<link rel="stylesheet" type="text/css" href="css/master.css">
<link href="js/fullcalendar/4.3.1/packages/core/main.css" rel="stylesheet">
<link href="js/fullcalendar/4.3.1/packages/daygrid/main.css" rel="stylesheet">
<link href="js/fullcalendar/4.3.1/packages/timegrid/main.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/jquery.qtip.css">
<link href="css/calendar.css">
<link rel="stylesheet" type="text/css" href="css/master.css">
<link rel="stylesheet" type="text/css" href="css/sweet-alert2.css">
</head>
<body>
<div id="calendar"></div>
</body>
</html>
我能够成功加载/显示日历并使用它，除了加载包含 rrule 重复指令的测试事件。我在调试器中收到一个错误，说它无法加载插件文件。FullCalendar 4.3.1似乎附带了一个JS脚本，包括：4.3.1/packages/rrule/main.js。所以，我想知道应该使用哪一个来容纳 RRule。我尝试删除插件部分中对"rrule"的引用。但是，事件仍然无法加载。关于我做错了什么的任何想法？
我将重新引用您在问题中提到的 https://fullcalendar.io/docs/rrule-plugin 相同的完整日历文档，但我将使用粗体文本来特别突出显示一个词：
如果使用标签和浏览器全局变量，则必须确保 来自 rrule 站点的原始非插件 rrule.js dist 文件是首先包含在您的页面上。
我认为您的错误只是将其包含在第二个(在完整日历文件之后(而不是第一个。完整的日历插件脚本无疑会检查 rrule.js 库是否存在。由于找不到它，因此将无法加载。
不要忘记，浏览器在解析每个脚本标记时会立即加载并执行每个脚本块，并且它会按照标记在 HTML 标记中出现的顺序依次执行。