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()+","; })