手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jquery复选框全选/取消示例
jquery复选框全选/取消示例
摘要:功能:a:实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态b:有一个子复选框选中则父复选框选中所有子复选框都不选中则父...

功能:

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("所有子复选框都未选中!");

}

});

};

以上实现 一个子复选框选中则父复选框选中 所有子复选框都不选中则父复选框不选中

【jquery复选框全选/取消示例】相关文章:

jquery预加载图片的方法

Jquery动态添加输入框的方法

JQuery中clone方法复制节点

jQuery封装的tab选项卡插件分享

JQuery中基础过滤选择器用法

jQuery实现鼠标经过图片变亮其他变暗效果

jQuery实现转动随机数抽奖效果的方法

jquery插件splitScren实现页面分屏切换模板特效

jquery实现的判断倒计时是否结束代码

jQuery取消ajax请求的方法

精品推荐
分类导航