Javascript 如果选中或未选中，则隐藏或显示复选框

我有一个问题，一些复选框，我没有成功地过滤他们，如果他们被选中或没有

原理很简单。如果我点击“全部”，所有的复选框都会显示出来，但如果我点击“选中”，我只想看到选中的复选框并隐藏未选中的复选框

这里是一个片段，请在您的答案中更新它，让我看看如何可以做到这一点

非常感谢

//选项数组
var choices=新数组（）；
选项[0]=“一月”；
选择[1]=“二月”；
选择[2]=“三月”；
选择[3]=“四月”；
选择[4]=“可能”；
选择[5]=“朱尼”；
选择[6]=“7月”；
选择[7]=“八月”；
选择[8]=“9月”；
选择[9]=“10月”；
选择[10]=“11月”；
选择[11]=“12月”；
var target=新数组（）
目标[0]=“5”；
目标[1]=“8”；
var cbh=document.getElementById（'checkbox'）；
var-val=''；
var cap=“”；
var j=“”；
var t=document.getElementById（'t'）；
//循环正在创建带有名称、值。。。
for（选项中的var i）{
//复选框的名称是它们的编号，因此我将I转换为字符串。
j=i.toString（）；
val=j；
//cap将是选项的值/文本[i]
var cb=document.createElement（'input'）；
var label=document.createElement（“标签”）；
cap=选择[i]；
var text=document.createTextNode（cap）；
cb.type='复选框'；
儿童（cb）；
cb.name=cap；
cb.value=val；
标签。附属物（cb）；
label.appendChild（文本）；
cbh.appendChild（标签）；
cb.addEventListener（'click'，updateText）
如果（目标指数f（i）>=0）{
cb.checked=true；
}
}
updateText（）；
函数updateText（）{
t、 value=[null，…document.querySelectorAll（'#checkbox[type=“checkbox”]”）reduce（（s，el）=>el和el.checked？s=（s | |？''）+el.value+'$#'：s | |'）
}

*{
框大小：边框框；
}
#资料{
填充物：5px；
宽度：100vw；
}
.多选{
溢出：可见；
填充：0；
左侧填充：1px；
边界：无；
背景色：#eee；
宽度：100vw；
空白：正常；
高度：200px；
}
.复选框{
高度：100px；
宽度：100px；
边框：1px实心#000；
背景色：白色；
左边距：-1px；
显示：内联块；
}
标签{
显示：内联块；
边框：1px灰色实心；
填充物：5px；
}

All |选中

您可以使用两个功能完成此操作，第一个功能显示输入的所有父项，第二个功能隐藏未选中的输入的所有父项

function All() {
  $("input").parent().show();
}

function OnlySelecteds() {
  $("input:not(:checked)").parent().hide();
}

//选项数组
var choices=新数组（）；
选项[0]=“一月”；
选择[1]=“二月”；
选择[2]=“三月”；
选择[3]=“四月”；
选择[4]=“可能”；
选择[5]=“朱尼”；
选择[6]=“7月”；
选择[7]=“八月”；
选择[8]=“9月”；
选择[9]=“10月”；
选择[10]=“11月”；
选择[11]=“12月”；
var target=新数组（）
目标[0]=“5”；
目标[1]=“8”；
var cbh=document.getElementById（'checkbox'）；
var-val=''；
var cap=“”；
var j=“”；
var t=document.getElementById（'t'）；
//循环正在创建带有名称、值。。。
for（选项中的var i）{
//复选框的名称是它们的编号，因此我将I转换为字符串。
j=i.toString（）；
val=j；
//cap将是选项的值/文本[i]
var cb=document.createElement（'input'）；
var label=document.createElement（“标签”）；
cap=选择[i]；
var text=document.createTextNode（cap）；
cb.type='复选框'；
儿童（cb）；
cb.name=cap；
cb.value=val；
标签。附属物（cb）；
label.appendChild（文本）；
cbh.appendChild（标签）；
cb.addEventListener（'click'，updateText）
如果（目标指数f（i）>=0）{
cb.checked=true；
}
}
updateText（）；
函数updateText（）{
t、 value=[null，…document.querySelectorAll（'#checkbox[type=“checkbox”]”）reduce（（s，el）=>el和el.checked？s=（s | |？''）+el.value+'$#'：s | |'）
}
函数All（）{
$（“输入”）.parent（）.show（）；
}
函数OnlySelecteds（）{
$（“输入：未（：选中）”）.parent（）.hide（）；
}

*{
框大小：边框框；
}
#资料{
填充物：5px；
宽度：100vw；
}
.多选{
溢出：可见；
填充：0；
左侧填充：1px；
边界：无；
背景色：#eee；
宽度：100vw；
空白：正常；
高度：200px；
}
.复选框{
高度：100px；
宽度：100px；
边框：1px实心#000；
背景色：白色；
左边距：-1px；
显示：内联块；
}
标签{
显示：内联块；
边框：1px灰色实心；
填充物：5px；
}

全部选定

您可以使用

checked

选择器选择所有选中的元素，以便显示/隐藏其父元素：

  $("#chkAll").click(function(){
    $(":checkbox").parent().show();
  });

  $("#chkSelected").click(function(){
    $(":checkbox").parent().hide();
    $(":checked").parent().show();
  });

以下是您更新的代码片段：

$（文档）.ready（函数（）{
//选项数组
var choices=新数组（）；
选项[0]=“一月”；
选择[1]=“二月”；
选择[2]=“三月”；
选择[3]=“四月”；
选择[4]=“可能”；
选择[5]=“朱尼”；
选择[6]=“7月”；
选择[7]=“八月”；
选择[8]=“9月”；
选择[9]=“10月”；
选择[10]=“11月”；
选择[11]=“12月”；
var target=新数组（）
目标[0]=“5”；
目标[1]=“8”；
var cbh=document.getElementById（'checkbox'）；
var-val=''；
var cap=“”；
var j=“”；
var t=document.getElementById（'t'）；
//循环正在创建带有名称、值。。。
for（选项中的var i）{
//复选框的名称是它们的编号，因此我将I转换为字符串。
j=i.toString（）；
val=j；
//cap将是选项的值/文本[i]
var cb=document.createElement（'input'）；
var label=document.createElement（“标签”）；
cap=选择[i]；
var text=document.createTextNode（cap）；
cb.type='复选框'；
儿童（cb）；
cb.name=cap；
cb.value=val；
标签。附属物（cb）；
label.appendChild（文本）；
cbh.append