轻松实现js弹框显示选项

先看看效果：

效果

-点击弹出弹框
-点击复选框，已选div中 显示已选中的选项
-再次点击取消选中状态，已选div中 显示的选中选项取消显示
-点击 已选 div中的 选项x图标，取消显示该选项 ，取消相应复选框选中状态​
-点击大类，小类取消选中状态，点击小类，选中大类取消选中状态
-最多3个选项可以被选中
-点击x图标关闭弹框
-点击确定按钮显示选择后的结果

代码块

html片段代码

  科室分类：
  

    
    
  
 


  

  

    

      

        
临床医学
        
辅助科室
        
其他
        

      
      

    

    

    
      

        
        

          
          内科
          

        
        @foreach($oLcyx1 as $key=>$val)
        

          
          {{$val->name}}
          

        
        @endforeach
        

         
        
        

          
          外科
          

        
        @foreach($oLcyx2 as $key=>$val)
        

          
          {{$val->name}}
          

        
        @endforeach
        

        
        
        

          
          其他
          

        
        @foreach($oLcyx3 as $key=>$val)
        

          
          {{$val->name}}
          

        
        @endforeach
        
 
                       
      
     
    
      

        

          

        
        @foreach($oFzks as $key=>$val)
        

          
          {{$val->name}}
          

        
        @endforeach
        
 
      
       
    
      

        

          

        
        @foreach($oYygs as $key=>$val)
        

          
          {{$val->name}}
          

        
        @endforeach
        
 
      
 
       
    


    

      

        
已选：
        

          

        
        

      
      

        
      
    


    
最多3个选项
  

 

 js片段代码

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。