fullCalendar js的DOM操作

我正在使用fullcalendar ,一个利用jQuery的JavaScript事件日历。

我需要编辑日历的所有日期单元格,添加两个垂直列表,两个都向左浮动; 我必须实现处理事件吗?

好; 我想不是。

有没有一种简单有效的方法来实现这一目标?

以下是我的代码,说明了我未能实现这一目标:

 $("#calendar").fullCalendar({ header: { left: 'prev', center: 'title', right: 'next' }, //defaultDate: '2015-02-12', monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'], dayNamesShort: ['D', 'L', 'M', 'M','J', 'V', 'S'], editable: false, eventLimit: true, // allow "more" link when too many events eventRender: function(event, element) { //element.find(".fc-view-month td").after($("").html("Prueba")); //element.find("div.fc-event-inner").prepend(""); //element.find("div.fc-event-inner").prepend(""); //element.find("table tbody td").prepend(""); //element.find(".fc-title").after($("").html("
")); //element.find(".fc-view-month").after($("td").html("
")); //$("#calendar .fc-view-month td").append("AM
"); } });

在此处输入图像描述

您可以使用::before伪和content之类的纯css来完成它,例如像fontawesome这样的标志性字体。

内容CSS属性与:: before和:: after伪元素一起使用,以在元素中生成内容。 使用content属性插入的对象是匿名替换元素。

以下是月视图的示例。

\Awhite-space: pre是需要断行图标的行。

码:

 .fc-widget-content::before { margin-top: 20px; font-family:'FontAwesome'; content:"\f0c9\A\f0ac\A\f09c\A\f257"; position: absolute; white-space: pre; } 

演示: http : //jsfiddle.net/IrvinDominin/dcx5unzd/

UPDATE

要显示包含数字的列,您可以使用该事件并相应地设置样式,如:

 .fc-event{ margin-left: 20px; width: auto !important; } 

以下是您的活动演示:

 var events_array = [{ title: '1\n2\n5\n8', start: new Date(2015, 9, 20), }, { title: '5\n4\n1\n2', start: new Date(2015, 9, 21), tip: 'Personal tip 2' }]; 

\n是列号换行符的基础。

看到:

在此处输入图像描述

演示: http : //jsfiddle.net/IrvinDominin/dcx5unzd/1/