【问题标题】：How to add active and remove existing active class collapse on bootsrap 4如何在引导程序 4 中添加活动和删除现有活动类崩溃
【发布时间】：2019-09-24 04:33:38
【问题描述】：

有人请帮助我，如何在“careers-menu-container”类之后添加“活动”类并在单击按钮（a）时删除现有的另一个活动类？。请检查我下面的代码！。

非常感谢。

<div class="container" id="myCollapse">
 <div class="col-sm-12 col-md-4 order-sm-1 order-md-1">
         <div class="careers-menu-container careers-menu-container__img1">           
            <a data-toggle="collapse" href="#collapseExtension1" role="button" aria-expanded="false" aria-controls="collapseExtension">APPLY NOW <i class="fas fa-caret-right"></i>
            </a>          
         </div>
      </div>
       <div class="collapse" id="collapseExtension1"  data-parent="#myCollapse">
            <p>lorem ipsum</p>
         </div>
      <div class="col-sm-12 col-md-4 order-sm-3 order-md-2">
         <div class="careers-menu-container careers-menu-container__img1">
           <a data-toggle="collapse" href="#collapseExtension2" role="button" aria-expanded="false" aria-controls="collapseExtension">APPLY NOW <i class="fas fa-caret-right"></i>
           </a>
         </div>
      </div>
       <div class="collapse" id="collapseExtension2"  data-parent="#myCollapse">
             <p>lorem ipsum</p>
        </div>
</div>

   

  $(".collapse.show").each(function(){
               // show active class here
           });
           // Toggle plus minus icon on show hide of collapse element
           $(".collapse").on('show.bs.collapse', function(){
                // show active class  and remove another active class
           }).on('hide.bs.collapse', function(){
                // remove  class here and show another active class
           });

【问题讨论】：

标签： javascript html twitter-bootstrap collapse

【解决方案1】：

您可以通过.collapse 使用.parent() 访问.careers-menu-container：

$(".collapse").on('show.bs.collapse', function(){
  $(this).parent().addClass('active')
}).on('hide.bs.collapse', function(){
  $(this).parent().removeClass('active')
});

【讨论】：