时间戳

首页 > 解决方案 > fullcalendar.js v4 - 如何在标题中设置 html？

javascript - fullcalendar.js v4 - 如何在标题中设置 html？

问题描述

有没有人有让 FullCalendar.js v4 将标题呈现为 html 的解决方案？获取元素并用 html 替换文本的所有旧方法在新版本上都不起作用。我在下面试过这个：

eventRender: function(info) {
  return $.parseHTML(info.event.title);

Semi 工作 - 呈现 Html，但它缺少事件中的其余 html 类。我的猜测是它需要修改完整的信息对象，但设置它不起作用： eventRender: function(info) { info.event.title = info.el.innerText; 返回信息

标签： javascripthtmlfullcalendarfullcalendar-4

解决方案

由于 fullCalendar v4 不再使用 jQuery，在eventRender期间提供的 HTML 元素现在是标准的 JS DOM 元素对象，通过 v4 的回调和方法提供的所有元素也是如此。有关更多信息，请参阅https://fullcalendar.io/docs/upgrading-from-v3。

这意味着您可以使用标准的 JavaScript DOM 方法来操作它。例如，您可以执行以下操作以使标题以斜体显示：

eventRender: function(info) {
  info.el.querySelector('.fc-title').innerHTML = "<i>" + info.event.title + "</i>";
}

演示：https ://codepen.io/anon/pen/XwmgLR?editors=1010

推荐阅读