Jquery 选项卡 - 在活动时添加 class

Question

我正在尝试编辑这个：

http://jsfiddle.net/rohankumar1524/HznC9/3/

如您所见，代码添加了 class "current_tab" at "ul.tab_nav li a" clicked。

我需要在 "ul.tab_nav li" 添加这个 class。

我试过这个：

$(document).ready(function(){
$('.tabs').each(function(){
    var tab = $(this);
    tab.find('.tab_content').hide(); // Hide all divs

    tab.find('ul.tab_nav li').click(function(){ //When any link is clicked
        if($(this).hasClass('current_tab')) return false;
        tab.find('ul.tab_nav li').removeClass('current_tab');
        $(this).addClass('current_tab'); //Set clicked link class to active

        var currentTab = tab.find($(this).attr('href')); // Set variable currentTab to value of href attribute of clicked link

        tab.find('.tab_content').hide(); // Hide all divs
        $(currentTab).slideDown(); // Show div with id equal to variable currentTab
        return false;
    });
});
});

但是这样"tab_content"就不会显示了。

有什么帮助吗？

Answer 1

在您的点击事件处理程序中 this 指的是一个 <li> 元素，但是您的 href 属性位于子 <a>元素：

<li><a href=".tab2"class="iconTab iconTabWifi">&nbsp;</a></li>

所以不要这样做：

var currentTab = tab.find($(this).attr('href'));

这样做：

var currentTab = tab.find($(this).find("a.iconTab").attr('href'));

Jquery 选项卡 - 在活动时添加 class

Jquery tab - add a class when active

jquery

jquery-ui-tabs