使用“标签”菜单面板，如何控制“有效”标签？

Question

我创建了一个bootstrap侧边栏面板作为标签导航。如何控制活动的选项卡？我知道有“活动”类，但是我如何实际设置它，所以当你点击“标签”时它会使它处于活动状态，以便正确显示？这会是JS / Jquery的事吗？我猜这是常见的事情，我只是无法通过stackoverflow或谷歌找到答案。谢谢！

Answer 1

如果我理解您的要求，您希望在点击某些内容时应用活动课程。您可以使用JQuery或JavaScript

执行此操作

JQuery的：

首先，给出所有标签或任何类，说'foo'。

然后使用它：

$('.foo').onClick(function(){
    $('.foo').removeClass('active');
    $(this).toggleClass('active');
});

这样，每当点击具有类'foo'的元素时，它只将类'active'添加到THAT ELEMENT ONLY，而不是添加到类中的所有元素。单击一个带有'foo'类的元素，它会从前一个带有'active'类的元素中删除'active'类，并将该类提供给刚刚单击的元素。

上面的方法使得只有一个类'foo'的元素一次可以拥有'active'类。如果您希望使多个元素具有“活动”类，请从代码示例中删除第二行。

如果我误解，评论，我会看到我能做些什么。