Javascript 带隐藏的多功能复选框

我在jQuery有点不在行，所以接下来

我有3个复选框，如果其中一个复选框被选中，我想隐藏我的标签，但是如果没有选中，我希望所有其他复选框都取消隐藏，同时如果有2个复选框被选中，我想隐藏与这些复选框相关的所有内容

我希望这是有意义的，任何帮助都是必要的

非常感谢

<input type="checkbox" class="example" id="check1"><label>check1</label>
<input type="checkbox" class="example" id="check2"><label>check2</label>
<input type="checkbox" class="example" id="check3"><label>check3</label>

<a class="check1" href="">check1</a>
<a class="check2" href="">check2</a>
<a class="check3" href="">check3</a>

<a class="check1" href="">check1</a>
<a class="check2" href="">check2</a>
<a class="check3" href="">check3</a>

<a class="check1" href="">check1</a>
<a class="check2" href="">check2</a>
<a class="check3" href="">check3</a>



    .hide {
      display: none;
    }



    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

    <script>
      $('#check1').change(function() {
        if ($(this).is(":checked")) {
          $(".check1").addClass("hide");
        } else {
          $(".check1").removeClass("hide");
        }
      });
    </script>

check1
支票2
支票3
.隐藏{
显示：无；
}
$（'#check1'）。更改（函数（）{
如果（$（this）.is（“：checked”））{
$（“.check1”）.addClass（“隐藏”）；
}否则{
$（.check1”）.removeClass（“隐藏”）；
}
});

在它工作之前，您需要做几件事：

使所有复选框都通用。改为绑定

.example

从单击的复选框中动态获取ID

封装

$（document）.ready（）函数中的所有内容

将

和标签文本封装在

标签内 我修改了HTML，使它看起来更好，更具语义

工作片段：

$（函数（）{
$（'.example'）.change（函数（）{
theID=this.id；
如果（$（this）.is（“：checked”））{
$（“+theID）.addClass（“隐藏”）；
}否则{
$（“+theID”）.removeClass（“隐藏”）；
}
});
//装货时检查。
$（“.example”）.each（函数（）{
如果（$（this）.is（“：checked”））
$（“+this.id）.addClass（“隐藏”）；
});
});
.hide{
显示：无；
}

支票1
支票2
支票3
使用toggle（）

您好，是否可以这样做，如果选中一个复选框，它将取消隐藏所有其他复选框，并取消选中其他复选框？然后在这种情况下，您可以使用单选按钮。这很好，但是如果标记具有check1和check2类，是否可以使其显示是否选中了乙醚复选框？是的，使用
if（$（elem）.hasClass(“check1”）//这样做
。非常抱歉，有点麻烦。你能将它添加到代码段吗？如果我的a标记是这样的，它工作不太正常，并且同时单击了check1和check2，然后我取消了check1，它仍然删除了隐藏类。哦，好吧！那是另外一回事。
$('.example[type=checkbox]').change(function() {  
    $("."+this.id).toggle(!this.checked);
});

you can this jquery code :

$('input[type="checkbox"]').change(function () {
            var chkId = $(this).attr("id");
            if ($(this).is(":checked")) {
                $("." + chkId).addClass("hide");
            } else {
                $("." + chkId).removeClass("hide");
            }
        });