Javascript 获取MaterializeCSS中活动选项卡的id

我知道如何使用jquery（如文档中所述）选择/激活materializecss中的选项卡（以编程方式）：

---

但是，当我单击按钮时，如何使用javascript或jquery获取materializecss中活动（选定）选项卡的id呢

您可以使用jquery。由于活动选项卡将具有类

active

，因此您可以使用它来获取选项卡id

$(function(){
    $('#submit').click(function(){
           alert($(".active").attr('id'));
        });
    });

这里有一把小提琴 试试这个

 $("ul.tabs > li > a").click(function (e) {
    var id = $(e.target).attr("href").substr(1);
    window.location.hash = id;});
var hash = window.location.hash;
$('ul.tabs').tabs('select_tab', hash);

---

首先生成散列id，然后将其放置到位

选项卡id

您可以使用活动类获取当前活动选项卡。因此可以获取当前选项卡的id。下面是一个演示

$（文档）.ready（函数（）{
$（'ul.tabs'）.tabs（）；
});
$（'#getID'）。单击（函数（）{
log（“活动选项卡：”+$（“.Active”）.attr（'id'）；
log（“活动选项卡Div:”+$（“.Active”）.attr（'href'）；
});






测试1
测试2
测试3
测试4
盖蒂
尽管上述技术可能还可以，但在materializecss中有正式的方法来实现这一点：

  $('ul.tabs').tabs({
    onShow: onShow,//Function to be called on tab Show event
    swipeable: false,
    responsiveThreshold: Infinity // breakpoint for swipeable
  });

    function onShow(tabOBJ){
        console.log(tabOBJ.selector);
    }

我希望这可能会对您和其他人有所帮助。
但单击按钮时不会调用show事件。。。
  $('ul.tabs').tabs({
    onShow: onShow,//Function to be called on tab Show event
    swipeable: false,
    responsiveThreshold: Infinity // breakpoint for swipeable
  });

    function onShow(tabOBJ){
        console.log(tabOBJ.selector);
    }