jquery复选框全选/取消示例,实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态
功能:
a:实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态
b:有一个子复选框选中则父复选框选中 所有子复选框都不选中则父复选框不选中
复制代码 代码如下: /** * 全选函数 * @param mainId 主复选框id * @param klass 下属复选框的class */ function selectAll(mainId,klass){ $("." + klass).each(function(){ if($("#" + mainId).attr("checked")== "checked"){ $(this).attr("checked", "checked"); } else{ $(this).removeAttr("checked"); } }); }
以上实现全选及全部取消 所有子复选框,至于数据的实现则在控制器里接收到复选框的数组即可
复制代码 代码如下: /** * 子复选框有一个选中 父复选框就选中 <br>子复选框全不选 父复选框不选中 * @param father 父复选框的id * @param son 子复选框的class */ function checkSonCheckBox(father,son){ $("."+son).click(function(){ if($(this).attr("checked")== "checked"){ $(this).addClass("checked"); }else{ $(this).removeClass("checked"); } if($("."+son).hasClass("checked")){ $("#"+father).attr("checked","checked"); // console.log("至少有一个子复选框选中!"); }else{ $("#"+father).removeAttr("checked"); // console.log("所有子复选框都未选中!"); } }); };
以上实现 一个子复选框选中则父复选框选中 所有子复选框都不选中则父复选框不选中 |