JQuery 日程管理组件 FullCalendar 渲染完重新加载
时间: 2023-10-02 19:05:35 浏览: 68
如果要重新加载 FullCalendar 日程管理组件,可以使用 `refetchEvents` 方法。该方法会从服务器重新获取事件并重新渲染 FullCalendar。
以下是一个示例:
```javascript
// 获取 FullCalendar 实例
var calendar = $('#calendar').fullCalendar('getCalendar');
// 重新加载事件
calendar.refetchEvents();
```
注意,在调用 `refetchEvents` 方法之后,FullCalendar 会向服务器发送请求以获取最新的事件数据。因此,您需要确保服务器端已经实现了正确的事件数据接口。
相关问题
JQuery 日程管理组件 FullCalendar设置同步
FullCalendar 可以与 Google Calendar 或其他第三方日历服务进行同步。以下为设置步骤:
1. 在 Google Calendar 中创建一个新的日历。
2. 在 FullCalendar 中添加 Google Calendar 的插件:
```
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/gcal.min.js'></script>
```
3. 在 FullCalendar 中配置 Google Calendar 的同步选项:
```
$('#calendar').fullCalendar({
googleCalendarApiKey: 'YOUR_API_KEY',
events: {
googleCalendarId: 'YOUR_CALENDAR_ID'
}
});
```
其中,`YOUR_API_KEY` 是你的 Google API 密钥,`YOUR_CALENDAR_ID` 是你在 Google Calendar 中创建的日历的 ID。
4. 保存配置并刷新页面,FullCalendar 将会从 Google Calendar 中同步事件。
JQuery日程管理组件 FullCalendar 设置前端展示高度
你可以通过设置 FullCalendar 的高度选项来控制其在前端的展示高度。具体来说,你可以在初始化 FullCalendar 实例时,通过设置 height 属性来指定其高度,如下所示:
```javascript
$('#calendar').fullCalendar({
height: 600, // 设置高度为 600 像素
// 其他配置项...
});
```
你可以根据需要调整 height 属性的具体值来满足你的需求。另外,你也可以将 height 的值设置为一个百分比,以使 FullCalendar 的高度随着浏览器窗口大小的变化而相应地自适应调整。例如,设置 height 为 "80%" 将使 FullCalendar 的高度自适应为浏览器窗口高度的 80%。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)