Javascript 如果已经处于活动状态，则停止切换

我想在兄弟姐妹之间切换类，但如果其中一个已经添加了Cals，我希望它不能更改

示例：（如果您单击一个已打开的分区，它将关闭。我需要的是，如果一个分区打开，您无法关闭它，只需单击另一个分区，关闭第一个分区并打开新分区）帮助

$（文档）.ready（函数（）{
$（'.sfb2'）。单击（函数（）{
$（this.toggleClass（'sfb-active'）；
$（this.sides（）.removeClass（'sfb-active'）；
});
});
.flex{
显示器：flex；
}
.中心{
保证金：自动；
}
.sfb1{
宽度：99.8%；
高度：400px；
}
.sfb2{
弹性：1；
利润率：0px 6px；
过渡：flex.4s立方贝塞尔（0.61，-0.19,0.7，-0.11）；
背景尺寸：1200px；
背景位置：中心；
背景重复：无重复；
边界半径：2px；
边框：1px实心rgba（0,0,0,0.1）；
背景：rgba（0,0,0,0.1）；
}
.sfb激活{
弹性：5；
}
在添加元素之前，检查元素是否具有激活的类
sfb
：

$('.sfb2').click(function(e) {
    if (!$(e.target).hasClass('sfb-active')) {
        $(this).toggleClass('sfb-active');
        $(this).siblings().removeClass('sfb-active');
    }
});

只需检查元素是否有类，如果没有，则执行代码。

$（this）.hasClass（'sfb-active'）{…}

这里，
this
上下文指向单击的元素本身


$（文档）.ready（函数（）{
$（'.sfb2'）。单击（函数（）{
if（！$（this）.hasClass（“sfb活动”））{
$（this.toggleClass（'sfb-active'）；
$（this.sides（）.removeClass（'sfb-active'）；
}
});
});
.flex{
显示器：flex；
}
.中心{
保证金：自动；
}
.sfb1{
宽度：99.8%；
高度：400px；
}
.sfb2{
弹性：1；
利润率：0px 6px；
过渡：flex.4s立方贝塞尔（0.61，-0.19,0.7，-0.11）；
背景尺寸：1200px；
背景位置：中心；
背景重复：无重复；
边界半径：2px；
边框：1px实心rgba（0,0,0,0.1）；
背景：rgba（0,0,0,0.1）；
}
.sfb激活{
弹性：5；
}