在Jquery-UI选项卡中按名称切换到选定的选项卡
如果我有三个标签：
<div id="tabs"> <ul> <li><a href="#sample-tab-1"><span>One</span></a></li> <li><a href="#sample-tab-2"><span>Two</span></a></li> <li><a href="#sample-tab-3"><span>Three</span></a></li> </ul> </div> 我想通过它的名字换成＃sample-tab-2。 我知道我可以切换到一个标签，如果我知道这是数字，但在我遇到的情况下，我不会知道这一点。
注：JQuery 1.3.1 / JQuery-UI 1.6rc6
我无法得到以前的答案工作。 我做了以下按名称获取选项卡的索引：
var index = $('#tabs a[href="#simple-tab-2"]').parent().index(); $('#tabs').tabs('select', index);
看来，使用ID作品以及索引，例如，简单地这样做将开箱即用…
$("#tabs").tabs("select", "#sample-tab-1");
这在官方文档中有详细logging ：
“select一个选项卡，就好像它被点击一样;第二个参数是要select的选项卡从零开始的索引， 或者选项卡关联的面板的idselect器（选项卡的href片段标识符，例如hash，指向小组的ID）“。
我认为这是在这个问题被问及后，可能在大多数的答案后添加
$('#tabs').tabs('select', index);
方法`'select'在jquery ui 1.10.0中不支持。 http://api.jqueryui.com/tabs/
我使用这个代码，并正常工作：
$('#tabs').tabs({ active: index });
您可以使用以下脚本按名称获取选项卡的索引：
var index = $('#tabs ul').index($('#simple-tab-2')); $('#tabs ul').tabs('select', index);
只有这个代码真正的作品！
$('#tabs').tabs(); $('#tabs').tabs('select', '#sample-tab-2');
使用这个function：
function uiTabs(i){ $("#tabs").tabs("option", "selected", i); }
并使用以下代码切换标签：
<a onclick="uiTabs(0)">Tab 1</a> <a onclick="uiTabs(1)">Tab 2</a> <a onclick="uiTabs(2)">Tab 3</a>
获取标签的从零开始的索引的唯一实用方法是逐步遍历制作标签集（LI> A）的每个元素，并匹配其内部文本。 它可能可以用一种更清洁的方式来完成，但是我是这么做的。
$('#tabs ul li a').each(function(i) { if (this.text == 'Two') {$('#reqTab').val(i)} }); $("#tabs").tabs({ selected: $('#reqTab').val() });
你可以看到我在页面中使用了一个隐藏的<input id =“reqTab”>字段，以确保variables从一个函数移到另一个函数。
注意：有一点小问题 – 在tabset被激活后select标签看起来并不像jQuery UI 1.8中公布的那样工作，这就是为什么我使用第一遍标识的索引来初始化标签集select所需的选项卡。
下面的一块为我工作
$($("#tabs")[0]).tabs({selected: 1});
希望这可以帮助！
试试这个：“select”/“active”标签
<article id="gtabs"> <ul> <li><a href="#syscfg" id="tab-sys-cfg" class="tabtext">tab One</a></li> <li><a href="#ebsconf" id="tab-ebs-trans" class="tabtext">tab Two</a></li> <li><a href="#genconfig" id="tab-general-filter-config" class="tabtext">tab Three</a></li> </ul>
var index = $('#gtabs a[href="#general-filter-config"]').parent().index();
jquery ui version 1.10.0不支持“select''
$('#gtabs').tabs('select', index);
备用解决scheme：使用“主动”：
$('#gtabs').tabs({ active: index });
如果您要更改hrefs，可以为链接<a href="#sample-tab-1" id="tab1"><span>One</span></a>分配一个id，以便您可以find标签索引由它的id。
@ bduke的答案实际上是稍微调整的。
var index = $("#tabs>div").index($("#simple-tab-2")); $("#tabs").tabs("select", index);
以上假设类似于：
<div id="tabs"> <ul> <li><a href="#simple-tab-0">Tab 0</a></li> <li><a href="#simple-tab-1">Tab 1</a></li> <li><a href="#simple-tab-2">Tab 2</a></li> <li><a href="#simple-tab-3">Tab 3</a></li> </ul> <div id="simple-tab-0"></div> <div id="simple-tab-1"></div> <div id="simple-tab-2"></div> <div id="simple-tab-3"></div> </div>
jQueryUI现在支持使用选项卡的ID / HREFselect器来调用“select”，但在构造选项卡时，“selected”选项仍然只支持数字索引。
我的投票是为了让我走上正轨。 谢谢！
这里是一个示例代码，通过名称获取选定的选项卡。 我希望这可以帮助你findypur解决scheme：
<html> <head> <script type="text/javascript"><!-- Don't forget jquery and jquery ui .js files--></script> <script type="text/javascript"> $(document).ready(function(){ $('#tabs').show(); // shows the index and tab title selected $('#button-id').button().click(function(){ var selTab = $('#tabs .ui-tabs-selected'); alert('tab-selected: '+selTab.index()+'-'+ selTab.text()); }); }); </script> </head> <body> <div id="tabs"> <ul id="tablist"> <li><a href='forms/form1.html' title="form_1"><span>Form 1</span></a></li> <li><a href='forms/form2' title="form_2"><span>Form 2</span></a></li> </ul> </div> <button id="button-id">ClickMe</button> </body> </html>
我很难得到任何答案，因为它们是基于旧版本的JQuery UI。 我们正在使用1.11.4（ CDN参考 ）。
这里是我的小提琴与工作代码： http : //jsfiddle.net/6b0p02um/我结束拼接在一起从四个或五个不同的线程位得到我的工作：
$("#tabs").tabs(); //selects the tab index of the <li> relative to the div it is contained within $(".btn_tab3").click(function () { $( "#tabs" ).tabs( "option", "active", 2 ); }); //selects the tab by id of the <li> $(".btn_tab3_id").click(function () { function selectTab(tabName) { $("#tabs").tabs("option", "active", $(tabName + "").index()); } selectTab("#li_ui_id_3"); });
