Javascript 如何切换所有复选框
如何切换复选框?使用javascript,我可以切换复选框。但是Jquery只切换一次Javascript 如何切换所有复选框,javascript,jquery,html,Javascript,Jquery,Html,如何切换复选框?使用javascript,我可以切换复选框。但是Jquery只切换一次 $(“#全部选中”)。单击(函数(){ 如果($(“#全部选中”)。已选中){ 对于(变量i=0;i
$(“#全部选中”)。单击(函数(){
如果($(“#全部选中”)。已选中){
对于(变量i=0;i<$('.check')。长度;i++){
$(“.check”)[i].checked=false;
}
}否则{
对于(变量i=0;i<$('.check')。长度;i++){
$(“.check”)[i].checked=true;
}
}
});代码>
检查的$(“#全部检查”)
始终是未定义的(在if-else表达式中计算为false
),因为jQuery包装$(“#全部检查”)
没有名为检查的属性。要获取元素的checked
属性的值,需要使用该方法。获取选中的当前状态,并再次使用.prop()
在所有其他复选框上设置它:
$(“#全部选中”)。单击(函数(e){
var checked=$(e.target).prop('checked');
$(“.check”).prop('checked',checked);
});代码>
- 使用
.prop('checked',Boolean)
- 使用
“change”
eventName
- 不要忘记,当使用
选中/取消选中所有组时,您还需要处理“All”复选框$ckb.未(“:选中”)。长度
下面是一个涵盖所有功能的更好示例:
const$all=$(“#全部检查”);
常量$ckb=$('.check');
$ckb.add($all).on('change',function(){
如果(此==$all[0]){
$ckb.prop('checked',this.checked');
}否则{
$all.prop('checked',!$ckb.not(':checked').length);
}
});代码>
全部的
1.
2.
3
请更详细地解释您想要实现的目标。应该可以理解这一点,而不必检查代码。