Javascript 如何更改a<；部门>；有身份证吗？

我在一个web应用程序中有一个选项卡式页面，我可以通过预算和菜肴筛选餐厅，结果是通过膳食、零食和饮料进行选项卡式显示

我的标签基本上都是按钮，它们下面有各自的窗口

这是我的选项卡的代码：

<ul class="nav tabs" id="tabs">
            <li id="selectMeals">
                <button href="#filterTab" data-toggle="tab" class="btn meals-tab">MEALS</button>
            </li>
            <li id="selectSnacks">
                <button href="#filterTab" data-toggle="tab" class="btn snacks-tab">SNACKS</button>
            </li>
            <li id="selectDrinks">
                <button href="#filterTab" data-toggle="tab" class="btn drinks-tab">DRINKS</button>
            </li>
</ul>

餐


小吃


饮料

我的按钮有一个href to one div，该div将显示包含以下代码的内容：

<div class="tab-content">
            <div id="filterTab" class="tab-pane meals-tab-box">
                     <div class="results"></div>
            </div>
</div>

我的选项卡是颜色协调的，当我单击任何选项卡时，选项卡内容的背景颜色不会更改为选项卡的颜色。这是因为

<div id="filterTab" class="tab-pane meals-tab-box">

只有当我希望在单击相应按钮时将“班级膳食”选项卡框更改为“零食”选项卡框或“饮料”选项卡框时，才有“班级膳食”选项卡框。（*-选项卡框CSS中只有不同的背景色）

---

有没有办法通过Javascript在被引用时更改div的类？

如果您可以使用jquery，您可以这样操作它，例如：

$('.tab li').removeClass('selected');
$('#selectMeals').addClass('selected');

---

您可以捕获和处理引导的选项卡事件，以便：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  e.target // activated tab
  e.relatedTarget // previous tab
})

您可以在事件中更改选项卡的类，也可以使用jQuery更改类

此外，您还有

show.bs.tab

event，更多详细信息如下：

您可以使用tabs小部件的

jQuery(function ($) {
    $('#tabs').tabs();
    var $filterTab = $('#filterTab');
    var $filterBtns = $('#tabs').find('button[href="#filterTab"]');
    var filterClasses = $filterBtns.map(function () {
        return this.className.match(/[^\s]+-tab/) + '-box'
    }).get().join(' ');
    $filterBtns.on('show', function (e) {
        var $btn = $(e.target),
            clazz = e.target.className.match(/[^\s]+-tab/) + '-box';
        var clazz = $filterTab.removeClass(filterClasses).addClass(clazz);
    })
});

---

演示：

使用的标签插件是哪一个？如果我没有弄错，这是Twitter的引导。是的，Twitter引导，很抱歉我忽略了这一点…你尝试过捕捉标签事件并通过它们进行处理吗？我没有在代码中尝试过任何东西，但我一直在想，例如，当单击饮料标签时，我会调用document.getElementById(“filterTab”）.className=“饮料选项卡框“在小提琴中工作得很完美，但我不能让它在我的实际代码中工作。@nutellafella那么你的代码和小提琴之间就有些不同了。。。你能检查一下所使用的引导版本吗？html是否真的与你想要的匹配have@nutellafella除非重新创建问题，否则没有什么可以解决的done@nutellafella然后，请分享您的解决方案，以便我们也可以查看它