Javascript Jquery复选框过滤器

我试图根据是否选中某些复选框来筛选列表项

我已经设法让过滤工作，但我正在努力删除页面加载上的所有列表项

在勾选“选项”复选框之前，不要显示“列表项”

我已经把我的工作版本放在这里了

提前向任何能帮助我的人表示感谢，非常感谢

---

用于筛选的javascript：

$(document).ready(function(){
    $("input.type_check").attr("checked", "").click(function() {
        if($(this).is(':checked')) {
            $("#case-studies li."+$(this).attr('id')).removeClass('type_hidden');
            $("#case-studies li").not(".type_hidden, .start_hidden").slideDown();
        } else {
            $("#case-studies li."+$(this).attr('id')).addClass('type_hidden');
            $("#case-studies li."+$(this).attr('id')).slideUp();
        }
    });

    $("input.start_check").attr("checked", "").click(function() {
        if($(this).is(':checked')) {
            $("#case-studies li."+$(this).attr('id')).removeClass('start_hidden');
            $("#case-studies li").not(".type_hidden, .start_hidden").slideDown();
        } else {
            $("#case-studies li."+$(this).attr('id')).addClass('start_hidden');
            $("#case-studies li."+$(this).attr('id')).slideUp();
        }
    });
});

---

HTML:

作物倡议
管理层
保证/认证
环境管理
生物多样性
工作人员
社区

波兰马铃薯
爱尔兰牛肉业
葡萄牙西红柿

只需将class

type\u hidden

添加到您的列表项中，如下所示：

<li id="event_1768" class="other classes type_hidden">– Potatoes, Poland</li>

波兰马铃薯

---

（当然比所有列表项都要多）

只需在列表项中添加类

type_hidden

，如下所示：

<li id="event_1768" class="other classes type_hidden">– Potatoes, Poland</li>

波兰马铃薯

---

（当然，对于所有列表项都是如此）

谢谢您的回复。我将类“type_hidden”添加到所有列表项中，但不幸的是，它们仍然显示在页面加载中。还有其他建议吗？谢谢，我似乎在任何地方都找不到你的风格，你确定你在什么地方定义了它吗？如果我将其添加到您的文档中，我将为我工作。谢谢您的及时回复。我将类“type_hidden”添加到所有列表项中，但不幸的是，它们仍然显示在页面加载中。还有其他建议吗？谢谢，我似乎在任何地方都找不到你的风格，你确定你在什么地方定义了它吗？如果我将其添加到您的文档中，我将为自己工作。