jQuery TabData：是否可以获取 ClickedTab 数据，而不是索引？答案

【问题标题】：jQuery TabData: Is it possible to get the ClickedTab data, instead index?jQuery TabData：是否可以获取 ClickedTab 数据，而不是索引？
【发布时间】：2008-12-11 05:12:30
【问题描述】：

我已经设计了 TabMenu，如下所示

<script type="text/javascript">
    $(function() {
      $('#container-1').tabs();
      $('#container-2').tabs();
    }
</script>

.....
<div id="container-1">
    <ul>
    <li><a href="#fragment-1"><span id="start">First</span></a></li>
    </ul>
</div>
<div id="container-2">
    <ul>
    <li><a href="#fragment-1"><span id="end">Last</span></a></li>
    </ul>
</div>
.....

是否可以获取 ClickedTab 数据，而不是索引？就像 ClickTab 是第一个然后是 #fragment1。否则，如果 ClickTab 是最后一个，#fragment2。

我该怎么做？

【问题讨论】：

标签： jquery tabs click

【解决方案1】：

你能澄清一下你的意思吗？

如果你改变这个：

<li><a href="#fragment-1"><span id="end">Last</span></a></li>

到：

<li><a href="#fragment-2"><span id="end">Last</span></a></li>

然后它会在你点击它时加载#fragment-2。

如果你真的想获取点击标签的数据，那么你可以钩入tabsselect事件

$('.ui-tabs-nav').bind('tabsselect', function(event, ui) {
//ui.panel is a dom element that contains the contents of the clicked tab.
}

更多阅读请访问Jquery UI docs

【讨论】：

【解决方案2】：

我希望这意味着你得到了另一部分的工作。在前面的示例的基础上，这是可能的：

  $(document).ready(function() {
      $('#container-1').tabs({
          selected : function(e, ui) {
            if ($($("a", e.target).get(ui.index)).attr('href') == '#fragment-1') {
                alert('First clicked!');
            }
          }        
      }); 
  });
   ....
  <div  id="container-1">
        <ul>
            <li><a href="#fragment-1"><span>Home</span></a></li>
            <li><a href="#fragment-2"><span>Contact</span></a></li>

         </ul>
  </div>

最终使用索引可能会更好，因为这需要您了解一些选项卡实现细节，并且您可以使用开关来处理每个选项卡的逻辑。但是，如果您觉得内容更适合您的需求，那么这应该可以正常工作。

【讨论】：