带有JS的引导选项卡窗格

Question

我正在使用带有Bootstrap选项卡面板的jQuery fullCalendar。

只有第一种有效，其他的无效。

当我取消选项卡式面板时，一切都正常。

这是我的密码。

@foreach(something) <div class="tab-pane fade<?php if($count == 1) echo ' in active'; ?>"> <div class="panel panel-info"> <div class="panel-body"> <div id="calendar{{ $count }}"></div> </div> </div> <div class="clearfix"></div> <script type="text/javascript"> $(document).ready(function(){
$('#calendar{{ $count }}').fullCalendar(); </script> </div> @endforeach

Answer 1

除非fullcalendar可见，否则无法呈现它。

每当更改选项卡时添加渲染调用：

http://fullcalendar.io/docs/display/render/

$('#my-tabs').tabs({
    activate: function(event, ui) {
        $('#calendar').fullCalendar('render');
    }
});