在没有选项卡处于活动状态且所有面板都隐藏的情况下启动jQuery UI选项卡 [英] Initiate jQuery UI Tabs with no tabs active and all panels hidden

问题描述

我在项目中使用 jQuery UI选项卡.我想知道是否有一种简单的方法可以在文档加载时隐藏所有面板，直到单击选项卡为止.默认情况下，jQuery UI以激活的选项卡开始，并且相应的面板可见.我知道您可以指定最初哪个选项卡处于活动状态，但我希望不选项卡处于活动状态，并且一开始不显示任何面板.

I'm using jQuery UI Tabs in a project. I'm wondering if there's an easy way to have all the panels hidden when the document loads, until a tab is clicked. By default jQuery UI starts with an activated tab and the corresponding panel visible. I know you can specify which tab to have active initially, but I'd like to have no tabs active and no panels displayed at the start.

我的代码非常简单:

<div id="tabs">

     <ul>
          <li><a href="#faq1">Link 1</a></li>
          <li><a href="#faq2">Link 2</a></li>
          <li><a href="#faq3">Link 3</a></li>
     </ul>

     <div class="faq-panel" id="faq1">
          <!-- content -->
     </div>

     <div class="faq-panel" id="faq2">
          <!-- content -->
     </div>

     <div class="faq-panel" id="faq3">
          <!-- content -->
     </div>

</div>

jQuery是标准的:

And the jQuery is standard:

$( "#tabs" ).tabs();

所以一切都在按现在的方式进行，我只想对此进行调整.我已经搜索了，但是还没有看到任何文档.谢谢！

So everything is working as it should right now, I just want to make this one tweak. I've searched and searched but I haven't seen any documentation on this. Thanks!

推荐答案

正如Matt在评论中建议的那样，它是:

As Matt suggests in the comments, it is:

$( "#tabs" ).tabs({collapsible: true, active: false });

示例: jsFiddle

这篇关于在没有选项卡处于活动状态且所有面板都隐藏的情况下启动jQuery UI选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！