javascript - 使用 jQuery 检测单击了哪个选项卡

Question

我有一些选项卡:

<ul id="tabs">
    <li><a href="#tab-allData">All data</a></li>
    <li><a href="#tab-someOtherData">Some other data</a></li>
    <li><a href="#tab-xyData">xyData</a></li>
</ul>

我想识别单击了哪个选项卡，并从 href 中删除 tab- 前缀。

我尝试过这个js函数:

$('#tabs').click(function (event) {        
    activeTab = $(this).attr('href').split('-')[1];        
    FurtherProcessing(activeTab);        
});

但我收到以下错误:

TypeError: $(...).attr(...) is undefined activeTab = $(this).attr('href').split('-')[1];

Answer 1

<ul id="tabs">
<li><a href="#tab-allData">All data</a></li>
<li><a href="#tab-someOtherData">Some other data</a></li>
<li><a href="#tab-xyData">xyData</a></li>
</ul>

$('#tabs').on("click", "li", function (event) {         
  var activeTab = $(this).find('a').attr('href').split('-')[1];
  FurtherProcessing(activeTab);        
});

演示: http://jsfiddle.net/6dRH6/2/