Fullcalendar 如何在';完整日历';标题部分?

Fullcalendar 如何在';完整日历';标题部分?,fullcalendar,Fullcalendar,我想在fullcalendar标题部分显示一些文本以及它旁边的图像 我有一个完整的日历,在下面的列中根据日期显示名称作为标题和相关数据。我想在它旁边显示名称和图片。为了测试目的,我尝试添加html元素,但没有得到预期的结果 这是为标题指定值的部分 $.map(SomeJSON, function (resourceitem, i) { var resource = new Object(); resource.id = resourceitem.UserID.toString()

我想在fullcalendar标题部分显示一些文本以及它旁边的图像

我有一个完整的日历,在下面的列中根据日期显示名称作为标题和相关数据。我想在它旁边显示名称和图片。为了测试目的,我尝试添加html元素,但没有得到预期的结果

这是为标题指定值的部分

$.map(SomeJSON, function (resourceitem, i) {
    var resource = new Object();
    resource.id = resourceitem.UserID.toString();
    resource.title = resourceitem.UserName;
    if (resourceitem.UserID == scheduleitem.AssignedStaff) {
        $('div[id*=calendarAgendaSchedule]').fullCalendar('addResource', 
        resource, scroll);
        }                       
    });

我尝试将html标记附加到标题

$.map(SomeJSON, function (resourceitem, i) {
    var resource = new Object();
    resource.id = resourceitem.UserID.toString();
    resource.title = resourceitem.UserName+'<div class="text-accent">test</div> ';
    if (resourceitem.UserID == scheduleitem.AssignedStaff) {
        $('div[id*=calendarAgendaSchedule]').fullCalendar('addResource', 
        resource, scroll);
        }                       
    });
$.map(SomeJSON,函数(resourceitem,i){
var resource=新对象();
resource.id=resourceitem.UserID.toString();
resource.title=resourceitem.UserName+'test';
if(resourceitem.UserID==scheduleitem.AssignedStaff){
$('div[id*=calendarAgendaSchedule]')。fullCalendar('addResource',
资源,滚动);
}                       
});

您必须使用该功能来修改元素

   resourceRender: function(resourceObj,labelTds, bodyTds) {
      labelTds.append('<img src="<your img url>">'); //using jquery to append the image tag to the element
    },
resourceRender:函数(resourceObj、labelTds、bodyTds){
labelTds.append(““>”);//使用jquery将图像标记附加到元素
},
另外,resourceObj将保存您的所有资源信息。您可以向保存图像url的资源对象添加一个新值,然后在resourceRender函数中使用此值。

您需要。请尝试下面的代码。这是一个在每个资源的左侧显示图像的工作代码,但您可以使用一些css来实现您的期望

  resourceRender: function(res){
    let imageStyles= "background:url('../assets/media/users/100_4.jpg') left center no-repeat;\
        border-radius:50%;\
        width: 30px;\
        height: 30px;\
        background-size: 35px;\
        margin-right:10px;\
        display: inline-block;"
    let elStyles = "display: flex;\
        justify-content: center;\
        align-items: center;"
    res.el.innerHTML = '<div style="'+elStyles+'">\
                      <div style="'+imageStyles+'">\
                      </div><div>'+res.resource.title+'</div>\
                    </div>';

  }
resourceRender:函数(res){
让imageStyles=“background:url('../assets/media/users/100_4.jpg')离开中心,不再重复\
边界半径:50%\
宽度:30px\
高度:30px\
背景尺寸:35px\
右边距:10px\
显示:内联块
让elStyles=“display:flex\
证明内容:中心\
对齐项目:居中
res.el.innerHTML\
\
“+res.resource.title+”\
';
}

您要求每个资源的标题图片?是的。我想在标题中的名称旁边添加一个图像。检查问题中的图像。这不起作用,因为标题属性被fullCalendar视为文本,而不是HTML。