我在我的活动中加载工具提示;但是,工具提示似乎不能在" eventLimit"酥料饼。
我尝试在点击事件上重新初始化工具提示,但点击事件发生在之前,而我需要在之后重新初始化工具提示。
是否有可以接线的事件或其他事件?
// tried this but it doesn't work...
eventLimitClick: function () {
$('[data-toggle="tooltip"]').tooltip({ container: 'body', html: true }); // re-init tooltips
return "popover";
},
Codepen示例: https://codepen.io/anon/pen/xWLKeK?editors=0110
完整代码(仅供参考):
$(function() {
$('#calendar').fullCalendar({
defaultView: 'month',
defaultDate: '2018-03-07',
header: {
left: 'prev,next',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
eventRender: function (event, element) {
element
.attr('title', event.title)
.attr('data-placement', 'bottom')
.attr('data-toggle', 'tooltip');
},
eventLimit: 2, // allow "more" link when too many events
eventAfterAllRender: function () {
$('[data-toggle="tooltip"]').tooltip({ container: 'body', html: true });
},
// tried this but it doesn't work...
eventLimitClick: function () {
$('[data-toggle="tooltip"]').tooltip({ container: 'body', html: true }); // re-init tooltips
return "popover";
},
events: [
{
title: 'All Day Event',
start: '2018-03-01'
},
{
title: 'Long Event',
start: '2018-03-07',
end: '2018-03-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2018-03-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2018-03-16T16:00:00'
},
{
title: 'Conference',
start: '2018-03-11',
end: '2018-03-13'
},
{
title: 'Meeting',
start: '2018-03-12T10:30:00',
end: '2018-03-12T12:30:00'
},
{
title: 'Lunch',
start: '2018-03-12T12:00:00'
},
{
title: 'Meeting',
start: '2018-03-12T14:30:00'
},
{
title: 'Birthday Party',
start: '2018-03-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2018-03-28'
}
]
});
});
答案 0 :(得分:2)
为什么要在eventRender中设置data-toggle属性
element.attr('data-toggle', 'tooltip')
然后在eventAfterAllRender
中使用泛型机制$('[data-toggle="tooltip"]').tooltip(...)
而不是直接在eventRender中执行
$(element).tooltip(...)
(实际上更多的问题,因为我不习惯bootstrap.js,这似乎是你正在使用的)。
答案 1 :(得分:1)
我的解决方案是观察插入.fc-popovers
的{{1}}并重新初始化工具提示:
.fc-view