-1

好的，所以我的代码基本上具有这种结构：

首先打开一个主 div 并使用 foreach 创建复选框。为数组中的每个“模型”创建一个复选框

<div id='coltext'>
  <input class ="ModelName1">
  <input class ="ModelName2">

等等

在此之后，另一个 div 在某些条件下在 foreach 循环中打开：

  <div class="seqWrap">
    <div class="hit""ModelName1"></div>
    <div class="hit""ModelName2"></div>
  </div>

</div>

我具有 hti 类的 div 将被着色。如果复选框被选中/未选中，我希望能够切换 div（class=hit）。因此，如果选中复选框“ModelName1”，则所有具有 class="ModelName1" 的 div 都将具有白色背景，或者被隐藏。

有人可以帮忙吗？

4

3 回答 3

2

我知道你接受你实现这个纯 CSS 的答案。像这样写：

.ModelName1:checked ~ .seqWrap .ModelName1,
.ModelName2:checked ~ .seqWrap .ModelName2
{background:none;}

检查这个http://jsfiddle.net/cpXPX/1/

于 2012-06-20T10:17:40.853 回答
1 
$('input:checkbox').change(function(){
  if ($(this).is(':checked'))
    $('div.'+$(this).attr("class")).hide();
  else
    $('div.'+$(this).attr("class")).show();
})
于 2012-06-20T10:01:53.283 回答
1

我发现你的问题有点令人困惑，但也许你的意思是这样的：

$('input[type="checkbox"]').click(function() {
   $('div.' + $(this).attr('class')).toggleClass('hit'); 
});

演示：http: //jsfiddle.net/cpXPX/

请注意，您的 html 中有一个拼写错误，用于您的子 div - 您在class属性中间有两个双引号，您应该有一个空格，所以更改：

<div class="hit""ModelName1"></div>

到

<div class="hit ModelName1"></div>

（如我的演示所示。）

于 2012-06-20T10:07:13.353 回答