详解checkbox选中和不选中 js判断单选框checkbox是否选中( 二 )

$(function(){varform = $('#test-form'),langs = form.find('[name=lang]'),selectAll = form.find('label.selectAll :checkbox'),selectAllLabel = form.find('label.selectAll span.selectAll'),deselectAllLabel = form.find('label.selectAll span.deselectAll'),invertSelect = form.find('a.invertSelect');// 全选与全不选selectAll.on("change",()=>{if(selectAll.prop("checked")) {//全选langs.prop("checked",true)selectAllLabel.hide()deselectAllLabel.show()}else{// 全不选langs.prop("checked",false)selectAllLabel.show()deselectAllLabel.hide()}select()})//反选invertSelect.on("click",()=>{//jquery对象要先使用Array.from方法转换成数组，利用数组来遍历//需要注意的是，遍历的每一个元素是dom对象，而不是jquery对象了,//不能再使用prop方法了Array.from(langs).forEach(item=>item.checked=!item.checked)select()})//当用户把所有语言都手动勾上时，“全选”被自动勾上，并变为“全不选”；//当用户手动去掉选中至少一种语言时，“全不选”自动被去掉选中，并变为“全选” 。function select(){var langsChecked = $('[name=lang]:checked')console.log(langsChecked)//如果选中的checkbox数量大于等于5，即是全部选中if(langsChecked.length>=5){selectAll.prop("checked",true)selectAllLabel.hide()deselectAllLabel.show()}else{selectAll.prop("checked",false)selectAllLabel.show()deselectAllLabel.hide()}}langs.change(select)})

以上关于本文的内容，仅作参考！温馨提示：如遇健康、疾病相关的问题，请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容，希望对您有所帮助：