在带有隐藏选项卡的 jQuery UI 1.9+ 上按 id 选择选项卡

Question

如何在最新版本的 jQuery UI 中按 id 选择选项卡？我曾经这样做过：

$(mytabs).tabs("select", "#tab_contents");

即使隐藏了一些选项卡，它也能正常工作。现在我升级了 jQuery UI，上面的代码不再工作了。我尝试在这个网站上关注一些other suggestions，结果是这样的：

$(mytabs).tabs("option", "active", $(mytabs).find("li").index("#tab_header"));

它不仅更加冗长，而且没有选择正确的选项卡，因为其中一些选项卡是隐藏的。怎么办？

附：为了隐藏一些标签，我使用了$("#tab_header").hide()。这在最近的版本中是否仍然正确，还是有更好的方法？

Answer 1

找到了解决办法：

$(mytabs).tabs("option", "active", $("#tab_header").index());

这会选择正确的选项卡，无论哪些选项卡可见（甚至可以选择当前不可见的选项卡 - 显示内容，但不显示标题）。

Answer 2

<div id="tabs">
    <ul>
       <li id="ha"><a href="#a">A</a></li>
       <li id="hb"><a href="#b">B</a></li>
       <li id="hc"><a href="#c">C</a></li>
       <li id="hd"><a href="#d">D</a></li>
       <li id="he"><a href="#e">E</a></li>
   </ul>
  <div id="a">AAA</div>
  <div id="b">BBB</div>
  <div id="c">CCC</div>
  <div id="d">DDD</div>
  <div id="e">EEE</div>
</div>

.index从0开始，

$(mytabs).tabs("option", "active", $("#ha").index());

但如果您使用 #a 而不是 #ha，请像这样使用

$(mytabs).tabs("option", "active", $("#a").index()-1);