選項卡中不呈現FullCalendar

Question

我有一些基本的自定義標簽設置，可以使用顯示/隱藏DIV的單擊事件來運行。

盡管使用了render函數（ docs ），FullCalendar仍未顯示在這些選項卡之一上。

$(".tabs .tab").click (e) ->
  ...
  $("#calendar").fullCalendar "render"

#calendar DIV最初是隱藏的，但是據我了解， render函數應強制日歷在每次單擊時進行渲染。 所有其他選項卡均正常運行，因此我知道顯示/隱藏功能完全沒有問題。

有人知道這里可能出什么問題嗎？

Answer 1

問題最終與我顯示/隱藏DIV的方式有關-

我用來隱藏DIV的CSS選擇器太寬，最終分配了display: none; 日歷DIV（是選項卡內容DIV的子級）。

解決方案是更改：

$("#tab-contents div").hide()

至：

$("#tab-contents").children().hide

在HTML中，日歷顯示如下（在HAML中）：

#tab-contents
  #tab-calendar
    #calendar
  #tab-other
    ...

感謝您的幫助和建議，我應該在一開始就發布更多代碼。

Answer 2

通常，某些腳本存在無法在隱藏的DIV上正常工作的問題。

我通常在加載頁面時顯示所有可見內容，大約200毫秒后，我將所有內容都隱藏起來，需要將其隱藏。

對於引導程序選項卡，我將每個選項卡容器設置為“活動”類，對於選項卡菜單，我將使用此觸發腳本。

setTimeout(function() {
    $('.my-tabs-control a').first().click();
}, 200);

您可以針對自己的腳本嘗試此解決方案。