如何显示/隐藏具有复选框值的项目

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

您可以使用类选择器：

$(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");
    }
  });

});