如何使用复选框动态过滤内容？ – jQuery

我试图使用复选框和jquery动态过滤掉内容。

作为jquery的新手，我不确定如何正确地做到这一点，所以如果任何可以帮助那将是伟大的。

我有这个代码：

  $(document).ready(function(){ $("#test").change(function() { if ($(this).is(":checked")) { $("#example").hide(); }else{ $("#example").show(); } }); });      
Example
 
Example2
   

我试图让它成为两个复选框动态工作，这意味着我不必像上面那样硬编码id，这只适用于第一个复选框。 我想有多个复选框，所以想知道如何做到这一点。 我是否在检查中获取ID并以某种方式插入？

任何帮助都会很棒，谢谢。

Answer 1

我可以给你的复选框这样一个类：

   
Example
 
Example2
​​​​​​​​​​​​​​​​ 

绑定时使用并动态获取ID，如下所示：

 $(document).ready(function(){ $(".cb").change(function() { $("#" + this.id.replace('test', 'example')).toggle(this.checked); }).change(); //match the initial show/hide match });​ 

你可以在这里尝试一下 ，而不是显示/隐藏它使用.toggle(bool) ，我们通过转换ID来选择匹配的

元素，用example替换test并获取该元素。