检查复选框是否被选中[重复]答案

【问题标题】：Check if the checkbox is checked [duplicate]检查复选框是否被选中[重复]
【发布时间】：2020-03-01 13:26:50
【问题描述】：

我想创建下一个逻辑：何时我将选中复选框以为另一个元素应用背景。我想只使用 css 来做到这一点。

div{
  border:1px solid red
}
input:checked .parent {
  background:red;
}

<div class="parent">
  <label for="">Text</label>
  <input type='checkbox'>
</div>

所以我想在选中复选框时为.parent 应用背景，但这不起作用。谁知道怎么解决？

【问题讨论】：

@Roy，不，因为在我的情况下，我无法更改 html。我没有访问权限
@epanalepsis，我正在寻找仅使用 css 而非 JQUERY 的答案

标签： css

【解决方案1】：

HTML

<div class="parent">
  <label for="">Text</label>
  <input type='checkbox'>
</div>

CSS

div{
  border:1px solid red
}
.selected{
  background:red;
}

jQuery

 $('input:checkbox').change(function(){
   if($(this).is(':checked')) 
       $(this).parent().addClass('selected'); 
  else 
      $(this).parent().removeClass('selected')
 });

输出

【讨论】：

我正在寻找仅使用 css 而非 JQUERY 的答案