如何使用复选框值显示/隐藏项目

Question

我想显示/隐藏具有特定类（相应输入之一）的项目。

所以这是我的代码：

$(document).ready(function(){
$("#fcheck input").click(function(){
    if ($("#fcheck input").is(":checked"))
    {
        //show the hidden div
        var zzz = $(this).val();
        $('li' + zzz).show("fast");
    }
    else
    {
        var yyy = $(this).val();
        $('li' + yyy).hide("fast");
    }
  });

});

我的“形式”：

<form id="fcheck">
            <input type="checkbox" name="school" value="school" id="school" /><label for="school">School</label>
        </form>

例如，应切换的内容：

<ul><li class="school">taratata</li></ul>

所以问题是我无法获得选择器的正确语法......

我的代码也非常难看。

问候：）

Answer 1

您可以使用class selector：

$(document).ready(function(){
$("#fcheck input").click(function(){
    if ($("#fcheck input").is(":checked"))
    {
        //show the hidden div
        var zzz = $(this).val();
        $('li.' + zzz).show("fast");
    }
    else
    {
        var yyy = $(this).val();
        $('li.' + yyy).hide("fast");
    }
  });

});