Question

我想在eventmouseover事件中显示一个事件描述的工具提示，以查找具有相同事件ID的重复事件，但我只想在第一次出现时在json feed中加载实际描述。事件。

想要这样做的原因是因为某些事件描述可能非常冗长，并且我不希望必须加载完全相同的段落100次或更多并通过网络发送，如果我可以访问第一次出现的描述，并在鼠标悬停在任何重复事件的工具提示中显示。

我的日历初始化代码是：

$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
editable: false,
allDayDefault: false,
events: "https://json_feed_url",
eventMouseover: function(e,m){
    var tPosX = m.pageX - 5 ;
    var tPosY = m.pageY + 20 ;
    $('#tooltip').css({top: tPosY, left: tPosX, display: 'block'});
    var tt = '';
    tt += e.id+'<br />';
    $('#tooltip').html(tt);
},
eventMouseout: function(){
    $('#tooltip').css({display: 'none'});
},
loading: function(bool){
    if (bool) $('#loading').show();
    else $('#loading').hide();
}
});

我的json数据源会是这样的：

 [
 {
    "id": 0,
    "title": "Study Hall",
    "start": "2012-01-09T15:00",
    "end": "2012-01-09T16:15",
    "color": "green",
    "description": "Discuss formal language theory and abstract machines"
},
{
    "id": 0,
    "title": "Study Hall",
    "start": "2012-01-11T15:00",
    "end": "2012-01-11T16:15",
    "color": "green",
    "description": ""
},
{
    "id": 0,
    "title": "Study Hall",
    "start": "2012-01-16T15:00",
    "end": "2012-01-16T16:15",
    "color": "green",
    "description": ""
},
{
    "id": 0,
    "title": "Study Hall",
    "start": "2012-01-18T15:00",
    "end": "2012-01-18T16:15",
    "color": "green",
    "description": ""
},
{
    "id": 0,
    "title": "Study Hall",
    "start": "2012-01-23T15:00",
    "end": "2012-01-23T16:15",
    "color": "green",
    "description": ""
},
{
    "id": 0,
    "title": "StudyHall",
    "start": "2012-04-25T15: 00",
    "end": "2012-04-25T16: 15",
    "color": "green",
    "description": ""
}
]

这在事件的第一次出现时工作正常，但其余的出现描述在工具提示中都是空白的。有没有人有引用第一次出现的解决方案？

谢谢

Answer 1

我使用对话框解决了eventMouseOver中的问题。我设置了一个对话框，其中包含与id设置的相应元素，然后根据需要设置适当的值。您可以提前设置这些值或加载页面。（并不是说我的代码有2种不同类型的约会来自2个不同的来源，所以eventType是“appt”，在这种情况下进行了测试。

eventMouseover: function(calEvent, jsEvent, view){
    if(calEvent.eventType == "appt")
        {
        $('#eventDetails').dialog({title: calEvent.title});
        $('#eventDetails').dialog('open');
        var myDialogX = jsEvent.pageX + 10;
        var myDialogY =  jsEvent.pageY + 10;
        $('#eventDetails').dialog( 'option', 'position', [myDialogX, myDialogY] );
        $('#appointmentTypeName').append(calEvent.appointmentTypeName);
        $('#appointmentReason').append(calEvent.appointmentReason);
        $('#appointmentTime').append(calEvent.start);
        $('#appointmentTitle').append(calEvent.appointmentTitle);
        $('#appointmentFacility').append(calEvent.facilityName);
         }
         },

有关具有相同ID的重复事件的工具提示说明

1 个答案: