我正在尝试动态渲染自定义事件以显示在页面上的完整日历上, 我从 url 获取已经存在的事件 $(.id).fullCalendar('addEventSource', '渲染json的文件名');
但我不知道如何渲染新事件
最佳答案
这是一个使用 demos 文件夹中的 default.html 的快速示例。我假设您创建一个事件并将其保存到数据库并希望该事件在日历上呈现。引用这部分文档:
http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/ http://arshaw.com/fullcalendar/docs/event_rendering/rerenderEvents/
此示例使用 renderEvent。单击该按钮后,将创建一个事件并将其呈现在日历上。
<!DOCTYPE html>
<html>
<head>
<link href='../fullcalendar/fullcalendar.css' rel='stylesheet' />
<link href='../fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='../lib/jquery.min.js'></script>
<script src='../lib/jquery-ui.custom.min.js'></script>
<script src='../fullcalendar/fullcalendar.min.js'></script>
<script>
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#button_id').click(function() {
var newEvent = {
title: 'NEW EVENT',
start: new Date(y, m, d)
};
$('#calendar').fullCalendar( 'renderEvent', newEvent , 'stick');
});
$('#calendar').fullCalendar({
editable: true
});
});
</script>
<style>
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}
#calendar {
width: 900px;
margin: 0 auto;
}
</style>
</head>
<body>
<button type="button" id="button_id" onClick=>Create new event</button>
<div id='calendar'></div>
</body>
</html>
关于jquery - 更改输入元素时,使用动态自定义数据在 fullcalendar 中渲染事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19603956/