根据点击 select 下拉列表 显示对应的值，全选、反选 功能实例

1.点击类型里面的某一个值，

2.显示 下面对应的明细

3.点击全选 ，选择所有，如果是全选，就取消全选

4.在全选的状态下，点击去掉 后面某一个选中的值，，全选按钮变为不选的状态

5.点击搜索按钮，把所有选中的值传给后台

代码如下：

                   
                            请选择
                             >获取
                             >消费
                             >扣减
                        

这块简单说一句： 全选的

                   明细
                    

id="mingxi">
                        
                        
                    

 

     //type选中的值
    function selectOnchang(val){
        var type_cur = $("#type option:selected").val();
        if(type_cur == '' ){
            $("#mingxilist").hide();
        }else{
            $("#mingxilist").show();
            console.log(type_cur)
        
            var mingxibox ='';
            $.ajax({          
                   url:"http://cms.5i5j.cn/broker/getintegraltype", 
                dataType:"json",
                type:"post", 
                async:false,
                data:{'type':type_cur},
                success:function(data){
    //                var typeval= JSON.parse(data);
                    var typeval    = data;
                    mingxibox +='全选

';
                    console.log(typeval)
                    for(var i in typeval){
                         mingxibox +=''+typeval[i]+'';
                    }
                    mingxibox +='

';
                    $('#mingxi').html(mingxibox);

                    var length=$("#owners input[name=box]:checked").length;
                    var len=$("#owners input[name=box]").length;
                    if(length==len){
                      $("#reverse").get(0).checked=true;
                    }else{
                      $("#reverse").get(0).checked=false;
                    }
                },      
                error:function(data){
                    console.log(data);
                }
            });
            
            //给全选的复选框添加事件
            $("#reverse").click(function(){
                  // this 全选的复选框
                  var userids=this.checked;
                  //获取name=box的复选框 遍历输出复选框
                  $("#owners input[name=box]").each(function(){
                    this.checked=userids;
                  });
            });
              
            //给name=box的复选框绑定单击事件
            $("#owners input[name=box]").click(function(){
                var curlist =[] 
                  //获取选中复选框长度
                  var length=$("#owners input[name=box]:checked").length;
                 //未选中的长度
                  var len=$("#owners input[name=box]").length;
                  if(length==len){
                  $("#reverse").get(0).checked=true;
                  }else{
                  $("#reverse").get(0).checked=false;
                  }
            });
            
        }
    }