Bootstrap 如何添加活动类和删除现有活动类在启动时折叠4

g0czyy6m  于 2022-12-07  发布在  Bootstrap
关注(0)|答案(1)|浏览(124)

有人请帮助我,如何添加“活动”类后“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
           });
tzcvj98z

tzcvj98z1#

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

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

相关问题