fullcalendar.js v4-如何在标题中设置html? [英] fullcalendar.js v4 - How to set html in title?

问题描述

有人可以通过FullCalendar.js v4将标题呈现为html的解决方案吗?在旧版本上，获取元素并用html替换文本的所有旧方法均不起作用.我在下面尝试过这个:

Does anyone have a solution for getting FullCalendar.js v4 to render the title as html? All the old ways of getting the element and replacing the text with html is not working on the new version. I have tried this below:

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

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

Semi works - the Html is rendered but its missing the rest of the html classes on the event. My guess is it needs the full info object modified but setting this is not working: eventRender: function(info) { info.event.title = info.el.innerText; return info

推荐答案

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

Since fullCalendar v4 no longer uses jQuery, the HTML element which is supplied during eventRender is now a standard JS DOM element object, as are all elements supplied via v4's callbacks and methods. See https://fullcalendar.io/docs/upgrading-from-v3 for more info.

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

This means you can use standard JavaScript DOM methods to manipulate it. For example, you could do something like this to make the title display in italics:

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

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

这篇关于fullcalendar.js v4-如何在标题中设置html?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！