📜  如何在Bootstrap 4的自定义列表组中的click事件上添加活动类?

📅  最后修改于: 2021-05-25 11:00:02             🧑  作者: Mango

在Bootstrap 4中,Javascript或jQuery事件用于在自定义列表组的click事件中添加活动类。

句法:

$(document).ready(function() {
    $('selector').click(function() {
        $('selector.active').removeClass("active");
        $(this).addClass("active");
    });
});

以下示例说明了如何使用jQuery以不同方式在自定义列表组的click事件中添加活动类。

示例1:下面的示例说明如何使用jQuery通过for循环在自定义列表组的click事件中添加活动类。




    
  
    
      
    
  
    
  
    
  
    

  

    
        
            

GeeksforGeeks

            

Active Item in a List Group

        
    
           
                                    
                
DSA Courses Available soon
                1 days ago             
                           

                This course is will take you from basics                 to advance as well as it will certify you                 on the basis of your performance.             

                           Students, Working Professionals         
                                               
                
Placement 100
                2 days ago             
                           

                This course will guide you for placements                 with theory, lecture videos, weekly                 assessments, contests and doubt assistance.             

                           Pre-final, Final year students         
                                               
                
                    Machine Learning Foundation With Python                 
                4 days ago             
                           

                Learn about the concepts of Machine Learning,                 effective machine learning techniques from                 basics with Python.             

                                            Students, Working Professionals                 seeking a career in ML                      
    
              

输出:

示例2:下面的示例说明如何使用jQuery以及jQuery类属性操作的addClass和removeClass在自定义列表组中的click事件上添加活动类。



  

    
    
    
    
    
    

  

  
    
        

GeeksforGeeks

        

Active Item in a List Group

        
                
  • Active item
  •             
  • Click me to active item
  •             
  • Click me too active item item
  •         
    
       

输出: