全选反选(子复选框框其中一个取消勾选，全选也自动取消勾选)

最新推荐文章于 2022-10-24 14:09:50 发布

zhang515745112

最新推荐文章于 2022-10-24 14:09:50 发布

阅读量4.9k

点赞数 1

文章标签：全选反选

本文链接：https://blog.csdn.net/zhang515745112/article/details/52396727

版权

js中方法

inputAll({
"inputQx":"input[name='scqx']",
"inputDx":"input[s='sc']"
});

function inputAll(config){

//页面是js加载的所以这里用全局查找，否则因为优先级找不到（可能加载页面靠后）

    $(document).on("click",config.inputQx,function(){
       if($(this).is(":checked")){
           $(config.inputDx).prop("checked",true);
       }else{
           $(config.inputDx).prop("checked",false);
       }
   });
   $(document).on("click",config.inputDx,function(){
       if($(config.inputDx).prop("checked")==""){
           $(config.inputQx).prop("checked",false);
       }
       var ls=$(config.inputDx).length;
       var chs=$(config.inputDx+":checked").length;
       if(ls==chs){
           $(config.inputQx).prop("checked",true);
       }else{
           $(config.inputQx).prop("checked",false);
       }
   });
}

另一种比较简单常用的：

这种没有上面的细微效果

js中方法

function selectAll(obj) {
   var inputDx=$("input[s='sc'][type='checkbox']");
   var inputQx= $(obj).prop("checked");
   $(inputDx).prop("checked", inputQx);
}