以编程方式选择和加载jquery选项卡
以编程方式选择和加载jquery选项卡
提问于 2009-06-09 15:35:04
我在尝试让这个功能工作时遇到了问题。我想在页面加载时自动加载选项卡。我使用了以下代码。
$tabs.tabs('select', 0); 然而，发生的情况是，它只是选择它，而不是加载它(该选项卡通过ajax加载)。有趣的是，当我选择另一个选项卡，然后再次返回到第一个选项卡时，它加载正常。
回答 6
Stack Overflow用户
回答已采纳
发布于 2009-06-09 15:42:59
您是否尝试过在初始化时指定选定的选项卡：
var $tabs = $('.selector').tabs({ selected: 0 });初始化后，您可以执行此操作以编程方式选择选项卡：
$tabs.tabs('option', 'selected', 0);编辑:这非常适合我：
var $tabs = jQuery("#tabDiv > ul").tabs( { selected: null } );
$tabs.tabs("select", 0);Stack Overflow用户
发布于 2009-06-09 18:51:57
我以前也遇到过同样的问题。我的解决方案是调用tabs()两次；一次没有参数；一次使用select选项：
例如：
$("#tabs").tabs();
$("#tabs").tabs('select', 2);Stack Overflow用户
发布于 2018-05-17 17:51:28
如果什么都不起作用，这里有一个小技巧：
您可以使用在jquery中添加和删除CSS类，如下所示：
// Firstly, remove the "active" class from div panel and <li> tag
$('#firstTab, #firstTabDiv').removeClass('active');
Also, remove the "in" class from div tag in which your panel resides
$('#firstTabDiv').removeClass('in');
Then add same class which you removed in the div and panel in which you want
to get automatically select
$("#thirdTab, #thirdTabDiv").addClass('active');
$("#thirdTabDiv").addClass('in');
<li id='firstTab' class="active">
<a href="#firstTabDiv" data-toggle="tab">
First Tab
</a>
</li>
<li id='secondTab' class="active">
<a href="#secondTabDiv" data-toggle="tab">
Second Tab
</a>
</li>
<li id='thirdTab' class="active">
<a href="#thirdTabDiv" data-toggle="tab">
Third Tab
</a>
</li>这样，您将能够在加载时自动显示选项卡。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/970838
复制相关文章
相似问题