Question

我很难准确描述问题所在......但相关链接是：http://www.evolutionarycollective.com/events/

您会注意到，当您加载“日历”标签时，日历不会显示。如果您调整窗口大小或以其他方式操作页面，则会显示日历。当日历不在标签内时，日历会正常加载。它在标题中被调用：

<script type='text/javascript'>
    jQuery(document).ready(function() {
    jQuery('#calendar').fullCalendar({
        events: themeforce.events
        });
    });
</script>

编辑：我相信这是脚本库中处理选项卡和窗格的部分..（我使用的是wordpress主题，通过短代码调用选项卡）

    // jQuery tool's tab creator is not shortcode friendly, transfer the titles to the correct tabs area
    jQuery('.bfi_pane').each(function(i) {
        var title = jQuery(this).attr('title');
        jQuery(jQuery(this).siblings('.bfi_tabs,.bfi_tabs_slide,.bfi_tabs_fade')[0]).append('<div><a href="#">'+title+'</a></div>');
    });

    // Custom slide effect for tabs. slide up then down
    jQuery.tools.tabs.addEffect('slide-slide',function(i, done) { 
        this.getPanes().slideUp(400).eq(i).delay(400).slideDown(400, done);           
    });
    // Custom slide effect for tabs. slide up and down simultaneously
    jQuery.tools.tabs.addEffect("slide", function(i, done) {
        this.getPanes().slideUp(400).eq(i).slideDown(400, done);
    });

    // IMPORTANT: SLIDEDOWN JQUERY FIX. we need to assign the correct heights
    // so that the slidedown effect doesn't JUMP
    jQuery(".bfi_accordion_pane").each(function(i) {
        var heightTo = jQuery(this).height();
        var paddingTop = parseInt(jQuery(this).css("padding-top").replace('px', ''));
        var paddingBottom = parseInt(jQuery(this).css("padding-bottom").replace('px', ''));
        var marginTop = parseInt(jQuery(this).css("margin-top").replace('px', ''));
        var marginBottom = parseInt(jQuery(this).css("margin-bottom").replace('px', ''));
        jQuery(this).css("height", heightTo + paddingTop + paddingBottom + marginTop + marginBottom);
    });

    // start jQuery tool tabs. we have to do this the long way so we can make
    // initialIndex work properly
    jQuery(".bfi_tabs_slide").each(function(i) {
        var openTab = jQuery(this).attr('rel');
        jQuery(this).tabs('> div.bfi_pane', {effect: 'slide-slide', initialIndex: parseInt(openTab, 10)});
    });
    jQuery(".bfi_tabs_fade").each(function(i) {
        var openTab = jQuery(this).attr('rel');
        jQuery(this).tabs('> div.bfi_pane', {effect: 'fade', initialIndex: parseInt(openTab, 10)});
    });

是否有某些方法可以在加载该选项卡时以某种方式刷新脚本..或者激活另一个文档。已经？

谢谢！

Answer 1

可能的解释是，完整的日历无法确定其高度，因为在最初创建时隐藏了标签，这将使其宽度和高度为零。

只需在标签切换事件处理程序中调用.fullCalendar()。

或者使用隐藏标签的“左偏”方法，如http://jqueryui.com/demos/tabs/

的最后几段所述

当用户切换到新的选项卡式元素时，更新jQuery脚本

1 个答案: