首页 > 解决方案 > 如何在 Fullcalendar 工具提示中动态显示循环子事件?

问题描述

我想在 Fullcalendar 插件中悬停事件时显示工具提示,但我只想按索引的工具提示顺序显示子事件。

如果我的 json 是这样的:

[{
"title":"event A,
"start":"2020-07-29",
"end":"2020-07-29",
"extendedProps":{"subevent":"sub 1","subevent":"sub 2","subevent":"sub 3"},
}, {
"title":"event B,
"start":"2020-07-30",
"end":"2020-07-30",
"extendedProps":{"subevent":"sub 4","subevent":"sub 5"}]

这是我的 eventMouseEnter:

eventMouseEnter: function(info) {
        var tis=info.el;
        var popup=info.event.extendedProps;
        var tooltip = '<div class="tooltipevent" style="top:'+($(tis).offset().top-5)+'px;left:'+ 
($(tis).offset().left+($(tis).width())/2)+'px"><div>Name ' + popup.title + '</div><div>sub event ' + popup.subevent + '</div></div>';
        var $tooltip = $(tooltip).appendTo('body');
  }
  

如何像这样动态显示我的子事件? 示例图片

谢谢你。

最好的祝福,

埃卡

标签: jqueryfullcalendar

解决方案


eventMouseEnter: function(info) {
        var tis=info.el;
        var popup=info.event.extendedProps;
        var detail=info.event.extendedProps.itenery;
        var arrayLength = detail.length;
        for (var i = 0; i < arrayLength; i++) {      
          var str = detail.join('<br/><br/> ');
        }
        var tooltip = '<div class="tooltipevent" style="top:'+ 
($(tis).offset().top-5)+'px;left:'+($(tis).offset().left+($(tis).width())/2)+'px"> 
<div>' + popup.title + '</div><div>' + str + '</div></div>';
        var $tooltip = $(tooltip).appendTo('body');
  }

推荐阅读