Javascript 选择器数据-具有多个值

我有一些带有值的复选框，这些值应该过滤页面中某个div的内容，我在选择这些div时遇到了一些问题

$（'input[type=checkbox]'）。在（'change'，function（）上{
/*在这里，我隐藏了所有的div，然后尝试生成正确的选择器来显示
与复选框选择相对应的div*/
$（'div'）.hide（）；
var listSelection=''；
$（'input[type=checkbox]：checked'）。每个（函数（）{
如果（列表选择==''）
listSelection=$（this.val（）；
其他的
listSelection+=''+$（this.val（）；
});
/*在这里，我选择它们失败了*/
$（“[data category=“”+listSelection+“]”）。show（）；
如果（列表选择==''）
$（'div'）.show（）；
});

A.


B


C


x
试试这个

替换：

 $('[data-category="' + listSelection + '"]').show();

借

PS:atribute的选择器为：

 $("typeElement[prop/attr='valueSearch']")

你的代码工作得很完美

只需为div添加一些值。像

<div data-category="a b c">Hello a b c</div>

Hello a b c

你的div是空的吗？
我不得不采取不同的方法。我将数据类别更改为类。其余的更改都在javascript中


$（'input[type=checkbox]'）。在（'change'，函数（）{
$（'div'）.hide（）；
var listFiltered=$（'div'）；
$（'input[type=checkbox]：选中'）。每个（函数（）{
listFiltered=listFiltered.filter（'.+$（this.val（））；
});
listFiltered.show（）；
});
First div
第二组
第三组
第四组
第五组
谢谢你，约翰，但它不起作用。当我选中多个复选框时，“过滤器”不起作用。ahmm。。尝试此$（'body input:checkbox'）。每个（函数（）{if（listSelection=''&$（this）.is（“：checked”））listSelection=$（this.val（）；else if（$（this）.is（“：checked”））listSelection+=''+$（this.val（）；}）；不，它们不是空的，这只是我正在研究的一个简单版本。我在JSFIDLE上使用了它，显示和隐藏了div。与jQuery1.7.2和onDomReady一起使用。谢谢。我做了一些更改，现在选中“a”和“c”，从技术上讲，您应该看到“第四个div”，但它不显示，甚至您也应该看到“第一个div”，因为它还包含“a”和“c”“假设我选中a->结果应该是显示的第一、第二、第三和第四个div，如果以后我选中a和c->结果应该是显示的第一和第三个div，但根本不显示任何内容是否要求显示其属性包含选中值的元素，或其属性与选中值完全匹配的元素？如上所述，如果选中了
a
和
c
，如果要求显示其属性包含
a
的所有元素，则将显示前4个div，而不仅仅是第一个和第三个div。如果可能的话，可以澄清要求吗？谢谢，我可以澄清一下。看看，您会发现每个div都有几个类别。如果您选中“a”和“c”复选框，我想显示“第四个div”。但是，由于该div中类别的顺序是“c a”而不是“a c”，因此该div不需要以任何组合顺序显示属性匹配的
div
，但没有单独与包含其中一个值的同级元素匹配？i、 例如，“CA”或“AC”只能匹配“CA”而不能匹配“ABC”？谢谢
<div data-category="a b c">Hello a b c</div>