將Facebox添加到FullCalendar事件

Question

我一直在試圖讓FullCalendar事件使用Facebox在單擊時彈出信息。我沒有問題把事件放在日曆上或者獲取需要顯示的信息，只是讓彈出框工作。

我曾嘗試將rel =「facebox」添加到包裝事件標題但不會影響它的「span」和「a」。

如果有人曾經嘗試過或知道可能的解決方案，我期待您的迴音。

Answer 1

我複製並從fullCalendar eventClick文檔頁面擴大例如：

$('#calendar').fullCalendar({ 
eventClick: function(calEvent, jsEvent, view) { 
    var txt = 'Event: ' + calEvent.title + '<br>' + 
      'Event Start: ' + calEvent.start + '<br>' + 
      'Event End: ' + calEvent.end + '<br>' + 
      'Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY + '<br>' + 
      'View: ' + view.name; 
    // for an image use: jQuery.facebox({ image: 'dude.jpg' }) 
    // for ajax page use: jQuery.facebox({ ajax: 'remote.html' }) 
    jQuery.facebox(txt); 
} 
}); 

哦，如果你想獲得其他任何calEvent對象，看看fullCalendar event object頁面。如果您使用的是谷歌日曆擴展程序，可能會有更多，包括description和location

Answer 2

這可能與facebox的工作方式有關。我認爲它可能只在頁面的初始加載時運行 - 因此，當您將這些添加到新元素時，facebox代碼已經運行並且新元素無法識別。

如果您正在使用此啓動facebox：

jQuery(document).ready(function($) { 
    $('a[rel*=facebox]').facebox() 
}) 

然後就是如此。您應該爲eventRender方法添加一些內容，以便在渲染事件時調用facebox方法，然後將它們實例化爲facebox元素。

從http://arshaw.com/fullcalendar/docs/event_rendering/eventRender/：

eventRender: function(event, element) { 
    element.qtip({ 
     content: event.description 
    }); 
} 

但不是 「element.qTip」 你會用 「element.facebox」 使用適當的參數。你可能也需要設置一個href。