如何在jquery.easytabs.js中获取当前选项卡

how to get current tab in jquery.easytabs.js

本文关键字：获取 选项 js jquery easytabs      更新时间：2023-09-26

我使用jquery.easytabs.js，为了选择某个选项卡，我使用

$("#tab-container").easytabs('select', '#nameTab');

但在选择之前，我想知道我在哪个选项卡中有人知道怎么做吗？

我试过这个，但不起作用：

$("#tab-container").easytabs('getSelected')

实际上，它确实返回了选项卡容器对象本身。

假设您有一个<ul>和<li>——位于以下行的标准选项卡导航结构：HTML:

<ul id="main-nav" class="tabs"> <li class="home"><a href="#home">Home</a></li> <li class="about"><a href="#about">About</a></li> <li class="contact"><a href="#contact">Contact</a></li>

然后，您可以很容易地在每个选项卡上查找类active并返回它。Jquery代码

$('ul#main-nav li').on('click', function() { 
     if($(this).hasClass('active')) {
          console.log($(this).attr('class'));
     }
});

您也可以将其保存到一个变量中，并进行进一步的操作：

    $('ul#main-nav li').on('click', function() { 
        if($(this).hasClass('active')) {
             var myTab = $(this).attr('class');
                if(myTab == "home active") {
                    //do stuff
                }
        }
   });

您可以使用jquery进行检查，因为当前选项卡将具有类"活动"：

$("#tab-container .tab.active")

最后我使用了javascript，这是我的代码：

var tab_active = window.location.hash.substr(1);
if (tab_active=="map"){
    moveTree('map');
}else if(tab_active==""){
    $("#tab-container").easytabs('select', '#map');
    moveTree('map');
}

您的javascript:

$('#tab-container').easytabs({uiTabs: true});
$('#tab-container')
  .bind('easytabs:before', function(id,val,t) 
      if(t.selector == "#tabs2"){
          alert("Selected tab 2");
      } 
  });

现在不确定这是否有帮助，但我尝试过：

$('#tab-container').easytabs('active', "#<tabID>")

如果该选项卡处于活动状态，则返回true。

相关文章：