在完整日历提示上获取 qTip2 Div ID

get qTip2 Div ID on Fullcalendar tips

本文关键字：获取 qTip2 Div ID 提示 日历      更新时间：2023-09-26

我有关于完整日历事件的qTip2提示。这些会自动呈现具有唯一的顺序 Div ID，例如

<div id="qtip-0" ...
<div id="qtip-1" ...
<div id="qtip-2" ...
etc ...

我需要直接与这些 Div 沟通，例如：

function qtip_do_something(DivID){
    $('#qtip-' + DivID).... do something
}

我正在努力的是识别每个qTip的特定Div ID。

我想通过事件内容中的函数调用将此 ID 传递给函数，如下所示：

eventRender: function (event, element) {
    element.qtip({
        content: {
                text: '<a href="#" onclick="qtip_do_something(' + div.id + '); return false;">Do something</a>'
        }

注意：我在上面的示例中使用了div.id来说明我想如何做到这一点。

有谁知道如何做到这一点？或者提供相同功能的替代方案。谢谢。

答案是根据需要将 ID 作为 JSON 或其他源的一部分传入，然后在元素中使用 id: event.id 命名：

eventRender: function (event, element) {
    element.qtip({
        id: event.id,        
        content: {
                text: '<a href="#" onclick="qtip_do_something(' + event.id + '); return false;">Do something</a>'
        }

附加说明（@ Dec 2014）：

例如，当您

在周和月之间更改视图时，完整日历中的 q提示不会被删除。但是，当您从一个视图移动到另一个视图时，提示将停止绑定。如果随后尝试与在另一个视图中使用自定义 ID 1234 创建的现有提示进行交互，因为它不再绑定，则会创建一个新 ID，但 id 1234 已与原始提示一起获取，并且会为此新提示提供新 ID。

您可以在控制台中看到此行为，新提示可能类似于 qtip-0 .

我通过删除在单击下一个、上一个、上个月等按钮时创建的所有提示来解决此问题：

function destroy_all_qtips(){
        $('.qtip').each(function(){
                $('div.qtip:hidden').qtip('destroy',true);
                $('div.qtip:visible').qtip('destroy',true);
        })
}

加载：

$('.prev-button').click(function(){
    destroy_all_fc_qtips();
});
$('.next-button').click(function(){
     destroy_all_qtips();
});
$('.today-button').click(function(){
    destroy_all_qtips();
});
$('.month-button').click(function(){
    destroy_all_qtips();
});
$('.agendaWeek-button').click(function(){
    destroy_all_qtips();
});
$('.agendaDay-button').click(function(){
     destroy_all_qtips();
});

希望这有帮助

相关文章：