简单：Addclass removeClass hasClass 问题？答案

【问题标题】：Easy: Addclass removeClass hasClass issue?简单：Addclass removeClass hasClass 问题？
【发布时间】：2012-11-14 22:27:54
【问题描述】：

我在容器 div 中有一些按钮需要切换为活动状态，但一次只有 1 个活动按钮。

编辑：

html 是： .filter 的 div 容器（btn、btn、btn 等）有 3 个按钮容器。第三个容器有一个按钮，其 id 为：#filter1-none

下面的代码可以使每组只有 1 个按钮处于活动状态。

此外，如果任何其他按钮处于活动状态，我将如何仅从 ID 为 #filter1-none 的按钮中删除活动？

$('.filter .btn').click(function () {
    $(this).addClass('active').siblings('.active').removeClass('active');
});

【问题讨论】：

标签： jquery

【解决方案1】：

你试过类似的东西吗？

$('.filter .btn').click(function () {
    $(this).closest('.filter').find('.btn.active').removeClass('active');
    $(this).addClass('active');
});

【讨论】：

但是如何从另一个具有活动类的按钮中删除活动类？
只是一种可能的增强。也许您可以使用$('.filter .btn .actice').removeClass()，因为页面上可能还有其他元素也有一个名为active 的类。
如果您有多个.filter，这将从所有这些中删除活动类。所以你需要使它相对于this。

【解决方案2】：

我通常会这样做：

$('.filter .btn').click(function () {
    $(this).addClass('active').siblings('.active').removeClass('active');
});

编辑：

这不允许“切换”行为。因此，.btns 的行为类似于收音机，而不是复选框。如果您正在寻找复选框类型的行为，请告诉我。

【讨论】：