如何将一个类添加到单击的按钮，并删除一个类到以前单击的按钮。我希望每次点击都只有一个活动按钮
我的HTML看起来像这样
<div class="nav-button">
<button id="btn-all">All</button>
<button id="btn-chicken">Chicken</button>
<button id="btn-pizza">Pizza</button>
<button id="btn-pasta">Pasta</button>
<button id="btn-drinks">Drinks</button>
</div>
我的jQuery看起来像这样
$('.nav-button button').on('click', function(){
$(this).addClass("active")
})
我不想一一选择按钮，因为这组按钮是动态的。我只使用上面的html示例在html中显示我的按钮
您可以先从所有按钮中删除该类：
$("div.nav-button button").removeClass('active');
因此，您可以执行以下操作：
$('.nav-button button').on('click', function(){
$("div.nav-button button").removeClass('active');
$(this).addClass("active");
}).active {
background-color: yellow;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="nav-button">
<button id="btn-all">All</button>
<button id="btn-chicken">Chicken</button>
<button id="btn-pizza">Pizza</button>
<button id="btn-pasta">Pasta</button>
<button id="btn-drinks">Drinks</button>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句