jQuery 手风琴和标签答案

【问题标题】：jQuery Accordion and TabsjQuery 手风琴和标签
【发布时间】：2011-03-29 12:10:16
【问题描述】：

我正在尝试让 jQueryUI 手风琴在 jQueryUI 选项卡中工作。我读过有人遇到问题，并发现有几篇文章报告称在选项卡的“显示”事件中初始化手风琴成功，但是当我尝试这个时，我得到的只是看起来像两个半样式的选项卡标题而没有手风琴功能。我的页面加载事件中有以下内容：

$().ready(function() {  
   tabs = $('.jqTabsStandard').tabs({
        show: function(ev, ui) {
            $('.ingredientsAccordion').accordion({
              autoHeight: true,
                header: 'h3 a'
            });
        } 
    });
});

页面是here - 点击食谱的编辑（铅笔）按钮，然后点击配料标签。

【问题讨论】：

如果手风琴不在选项卡中，它还能工作吗？你也可以只给标签和手风琴的html
请查看：stackoverflow.com/questions/1542161/…

标签： jquery jquery-ui tabs accordion jquery-ui-accordion

【解决方案1】：

解决方案很简单，只需更改 UI 的加载顺序即可。首先初始化手风琴，标签，这样手风琴有高度并且不可见。

【讨论】：

【解决方案2】：

我使用 Chrome 中的开发人员工具检查：您的手风琴数据容器没问题，但高度为 1 像素。这就是为什么你几乎什么都看不到的原因。尝试更改标签容器的高度，因为当手风琴在适合内容的标签上启动时，手风琴实际上没有滑动空间。我很抱歉英语不好:)

【讨论】：

但是容器没有明确的高度，它应该是可用的标签高度，但是当页面加载时第二个标签（带有手风琴）是隐藏的，它是不可见的。