如何从 FullCalendar 中的事件获取弹出消息中事件的开始和结束时间？答案

【问题标题】：How to get start and end time of event in popover message from an event in FullCalendar?如何从 FullCalendar 中的事件获取弹出消息中事件的开始和结束时间？
【发布时间】：2018-05-10 21:32:32
【问题描述】：

当鼠标悬停在monthView 的FullCalendar 中的事件上时，我想将每个事件的start 和end 时间显示为popover 消息。

我有以下：

element.popover({
    content: event.start,
    animation: true,
    delay: 300,
    content: event.start + event.end,
    trigger: 'hover',
    placement: 'top',
    container: 'body'
});

当我在content 中有event.start 或event.end 时，我会通过以下方式正确获得date 和time：Wed May 09 2018 08:00:00 GMT +0000。但是当我在content 中有event.start + event.end 时，我得到一个模糊的数字：3051738000000。

假设start 是09:00:00，而end 是15:00:00。我想让消息说：

Start: 9AM
End: 3PM

我该怎么办？

【问题讨论】：

请参阅momentjs.com/docs/#/displaying，了解如何设置日期格式并选择所需格式。 start 和 end 都是 momentJS 对象。我认为您在+ 那里看到的是它假设它是一个数学运算并将两个日期表示的总毫秒数相加。您需要专门将日期格式化为字符串，以确保得到您想要的。
感谢您的评论！我看了看，确实有帮助。但是，我有一个小查询，我得到了正确格式的start 和end，但我需要一个linebreak，以便start 和end 显示在两个不同的行上。这就是我到目前为止所拥有的...content: '<p>' + 'Start: ' + event.start.format('h:mm a') + '</p><p>' + 'End: ' + event.end.format('h:mm a') + '</p>' 的输出是：`
开始：上午 8 点

结束：下午 5 点
解决了@ADyson。我不得不输入html: true。我会发布正确的答案。

标签： javascript jquery fullcalendar momentjs popover

【解决方案1】：

start 和 date 的格式需要采用正确的方式。 Displaying format 显示正确的 format。谢谢@ADyson 的链接！（见 cmets）。另外，要在内容中启用html，我们需要设置html: true,。

element.popover({
    animation: true,
    delay: 300,
    trigger: 'hover',
    placement: 'top',
    html: true,
    container: 'body',
    content: '<p>' + 'Start: ' + event.start.format('h:mm a') + '</p><p>' + 'End: ' + event.end.format('h:mm a') + '</p>'

});

【讨论】：