javascript - 带全日历的 Qtip

Question

我正在尝试学习 fullcalendar 的 qtip，但它似乎不起作用。我已经尝试了所有教程/示例，但没有像他们所说的那样有效。我正在使用以下代码，但我尝试了许多其他替代方案。我有什么明显的错误吗？

dayClick: function(date, allDay, jsEvent, view) { 
    $(this).qtip({ 

        content:"",
        overwrite: false,
        position: { corner: { target: 'topMiddle', tooltip: 'bottomMiddle' },
        viewport: $(window), // Keep it on-screen at all times if possible
        adjust: { x: 10, y: 10 } },
        show: { when: 'click', // Don't specify a show event
        ready: true // Show the tooltip when ready },
        hide: { when: 'click' },
        style: { 
        border: {  width: 5, radius: 10 }, 
        padding: 10, 
        textAlign: 'center', //tip: true, 
        // Give it a speech  bubble tip with automatic corner detection name: 'cream' 
        // Style it according to the preset  'cream' style } }); }

Answer 1

我在 fullCalendar 应用程序中使用了 qTip，如下所示:

在事件渲染中:

eventRender: function(event, element) {
    element.qtip({
                    content : [HTML SHOWING CONTENT],
                    position: {[position info]}
                    ... rest of settings...
                 });
    },

然后当我想要显示 qTip 时(对我来说在 eventMouseover 中)

eventMouseover: function(event) {
        jQuery(this).qtip();
    },
eventMouseout: function(event) {
        jQuery(this).qtip().hide();
    },

也就是说.. 在 eventRender 中，使用 element.qtip 设置 qtip，在 dayClick 中只需调用 $(this).qtip() 函数。 不知道为什么我这样做，但它有效:)