js中:
<
label
><
input
type
=
"checkbox"
id
=
"cb_all"
/>全选</
label
>
<
label
><
input
type
=
"checkbox"
class
=
"cb_fruit"
/>苹果</
label
>
<
label
><
input
type
=
"checkbox"
class
=
"cb_fruit"
/>香蕉</
label
>
<
label
><
input
type
=
"checkbox"
class
=
"cb_fruit"
/>橘子</
label
>
<
script
src
=
"jquery-1.10.2.min.js"
></
script
>
<
script
>
//当改变全选值时
$("#cb_all").change(function(){
//如果全选被选中,则选中所有子选项;否则取消选中子选项
if($(this).is(":checked")){
$(".cb_fruit").prop("checked",true);
}else{
$(".cb_fruit").prop("checked",false);
}
});
//当改变子选项时,需要判断子选项是否全部被选中,如果全部被选中,那么全选被选中;否则全选不被选中
$(".cb_fruit").change(function(){
if($(".cb_fruit:checked").length==$(".cb_fruit").length){
$("#cb_all").prop("checked",true);
}else{
$("#cb_all").prop("checked",false);
}
});
</
script
>
layui中的效果:
var i=0; form.on('checkbox(test22)',function(data){ if($("#tt div:first").nextAll().children("div").hasClass("layui-form-checked")){ i++; } if($("#tt div:first").nextAll().children("div").length == i){ $("#tt div:first").addClass("layui-form-checked"); }else{ $("#tt div:first").removeClass("layui-form-checked"); } }); form.render(); //更新全部 form.on('select'); //刷新select选择框渲染
checkbox
选中将值添加数组,如果存在就移除数组中,
var arr=new Array();
$("input[id^='sellerGoodStroeProductSkuId_']").click(function(){
if(jQuery.inArray($(this).val(),arr) == -1){
arr.push($(this).val());
}else{
var num= jQuery.inArray($(this).val(),arr);
arr.splice(num,1);
}
});
$("#checkboxs").val(arr);
全选,取消全选
<input type="button" id="checkall" name="checkall" value="全选" />
$("#checkall").click(
function(){
if(this.checked){
$("input[name='checkname']").attr('checked', true)
}else{
$("input[name='checkname']").attr('checked', false)
}
}
);
将checkbox选中的值添加到字符串中
var arr="";
jQuery("input[name^=id_]:checkbox:checked").each(function(index,item){
arr+=jQuery(this).val()+",";
})