Jquery 取消选中&x27；选择全部'；未选中复选框时

“全选”工作正常，但问题是当我取消选中所有“项目”时，“全选”仍显示选中状态，如果所有“项目”均未选中，则应取消选中

$（“#全选”）。单击（函数（）{
$（'input:checkbox'）.not（this.prop（'checked'，this.checked））；
$（“.global下载栏”）.toggle（）；
});
正文{
位置：相对位置；
高度：300px；
}
.全球下载栏{
宽度：100%；
高度：50px；
位置：绝对位置；
底部：0；
背景：黑色；
显示：无；
}

全选

项目1
项目2
项目3
听起来您需要在
检查项中添加一个处理程序-如果单击时未选中任何项，请取消选中
检查所有项
并隐藏
全局下载栏

请注意，单个文档中的重复ID是无效的HTML，最好使用类


const$checkAll=$（“#checkAll”）；
$checkAll.单击（函数（）{
const{checked}=这个；
$（'.checkItem'）.prop（'checked'，this.checked）；
如果（选中）$（“.global下载栏”）.show（）；
else$（“.global下载栏”）.hide（）；
});
$（'.checkItem'）。单击（函数（）{
如果（$（'.checkItem:checked'）。长度==0）{
$checkAll.prop（'checked'，false）；
$（“.global下载栏”）.hide（）；
}
})
正文{
位置：相对位置；
高度：300px；
}
.全球下载栏{
宽度：100%；
高度：50px；
位置：绝对位置；
底部：0；
背景：黑色；
显示：无；
}

全选

项目1
项目2
项目3
您应该监听
检查项
元素的
更改
事件。如果选中的
：复选框数与元素总数相同，则执行所需操作

由于标识符在HTML中必须唯一，请使用common类来定位
复选项
复选框


var childcheckbox=$（'.checkItem'）；
子复选框。on（'change'，function（）{
var allchildcheckbox schecked=childcheckbox.length==childcheckbox.filter（':checked'）.length；
$（'#checkAll'）.prop（'checked'，allChildCheckboxesChecked）；
//也许吧
如果（所有儿童复选框已选中）{
$（“.global下载栏”）.toggle（）；
}
});
$（“#checkAll”）.change（函数（）{
ChildCheckBox.prop（'checked'，this.checked）；
$（“.global下载栏”）.toggle（）；
});
正文{
位置：相对位置；
高度：300px；
}
.全球下载栏{
宽度：100%；
高度：50px；
位置：绝对位置；
底部：0；
背景：黑色；
显示：无；
}

全选

项目1
项目2
项目3
在我看来，这是一种更清洁的解决方案


$（“#全选”）。单击（函数（）{
$（'input:checkbox'）.not（this.prop（'checked'，this.checked））；
});
$（'.checkItem，#checkAll'）。在（'change'，function（）上{
如果（$（'.checkItem'）。长度==$（'.checkItem:checked'）。长度）{
$（“#checkAll”）.prop（'checked'，true）；
$（“.global下载栏”）.show（）；
}否则{
$（“#checkAll”）.prop（'checked'，false）；
$（“.global下载栏”）.hide（）；
}
});
正文{
位置：相对位置；
高度：300px；
}
.全球下载栏{
宽度：100%；
高度：50px；
位置：绝对位置；
底部：0；
背景：黑色；
显示：无；
}

全选

项目1
项目2
项目3

$（'checkAll'）。在（'click'，function（）上{
如果（$（'#checkAll'）。是（':checked'））{
$（'input[type=“checkbox”]”）。不是（$（this））.prop（'checked'，true）；
}否则{
$（'input[type=“checkbox”]”）。不是（$（this））.prop（'checked'，false）；
}
});
$（'input.checkItem'）。在（'click'，function（）上{
让状态=假；
常量复选框=$（'.checkItem'）；
state=Array.prototype.every.call（复选框，（ele）=>{
返回$（ele）.is（':checked'）；
});
如果（州）{
$（“input#checkAll”）.prop（'checked'，state）；
}否则{
$（“input#checkAll”）.prop（'checked'，state）；
}
})

全选

项目1
项目2
项目3
首先，您在每个复选框上使用相同的Id，这是不对的。第二，尝试以下方法：请在以下位置查看：