jQuery UI选项卡.如何根据不基于索引的id选择选项卡

use*_*663 46 jquery jquery-ui jquery-plugins jquery-selectors

我有两个选项卡并配置了jQuery UI.

ul  class="tabs"
  li  tabone
  li tabtwo
ul
Run Code Online (Sandbox Code Playgroud)

动态地从C#代码后面我将隐藏或选择一些选项卡让我们说tabtwo,另一个选项卡必须隐藏或不显示.我可以使用JavaScript在JavaScript中执行此操作.tabs({selected:1});,.tabs(disable:0).但我不想使用选项卡索引来执行此操作.

是否有任何备用选项根据其名称/ ID选择?

sta*_*ski 130

接受的答案对我来说也不起作用,但是我在类似的线程中找到了解决方案: 在Jquery-UI选项卡中按名称切换到选定的选项卡

var index = $('#tabs a[href="#simple-tab-2"]').parent().index();
$('#tabs').tabs('select', index);
Run Code Online (Sandbox Code Playgroud)

使用jQuery UI> = 1.9:

var index = $('#tabs a[href="#simple-tab-2"]').parent().index();
$("#tabs").tabs("option", "active", index);
Run Code Online (Sandbox Code Playgroud)

  • +1这是正确的解决方案.不是OP的一个标志. (5认同)

Jas*_*Cav 18

注意:由于对jQuery 1.9和jQuery UI所做的更改,这个答案不再是正确的答案.请参阅下面的@ stankovski的答案.

您需要首先找到选项卡的索引(这只是它在列表中的位置),然后使用jQuery UI提供的select事件(tabs-> select)专门选择选项卡.

var index = $('#tabs ul').index($('#tabId'));
$('#tabs ul').tabs('select', index);
Run Code Online (Sandbox Code Playgroud)

更新:顺便说一句 - 我确实知道这(最终)仍在按索引进行选择.但是,它并不要求您知道选项卡的具体位置(特别是当它们按照问题中的要求动态生成时).

  • 由于jQuery UI对其API进行了重大更改,因此该答案已不再适用. (7认同)

Gar*_*ett 15

从最新的文档中,select方法获取选项卡面板的索引或id(href哈希值).文件说明:

选择一个选项卡,就像单击它一样.第二个参数是要选择的选项卡的从零开始的索引或与选项卡关联的面板的id选择器(选项卡的href片段标识符,例如hash,指向面板的id).

所以,给定一个布局

<div id="myTabs">    
    <ul  class="tabs">
      <li><a href="#tabone">tabone</a></li>
      <li><a href="#tabtwo">tabtwo</a></li>
    </ul>   
</div>
Run Code Online (Sandbox Code Playgroud)

以下作品

$('#myTabs').tabs('select', '#tabtwo');
Run Code Online (Sandbox Code Playgroud)

这是一个例子.

UPDATE

上述解决方案适用于小于1.9的jQuery UI版本.对于版本1.9+的解决方案,请参阅@ stankovski的回答.