按多个数据属性元素过滤答案

【问题标题】：Filter by multiple data attribute elements按多个数据属性元素过滤
【发布时间】：2017-02-27 23:24:19
【问题描述】：

如果数据属性具有所有选择选项值，而不仅仅是一个或另一个，我有一些我想使用选择过滤的列表项。

<li class="filterme" data-type="Primary Academy Physical KS1">item 1</li>
<li class="filterme" data-type="Secondary Academy Physical KS2">item</li>
<li class="filterme" data-type="Secondary Academy Physical KS1">item 1</li>
<li class="filterme" data-type="Academy Physical KS1">item 1</li>

我有一些选择框触发 onchange 事件，该事件首先隐藏所有项目

$('.filterme').hide();

然后我想显示一个数据属性是否包含传递给它的所有值。我试过了

$(".filterme[data-type*='" + Secondary && Physical && KS1 + "']").show();

我想展示这个

<li class="filterme" data-type="Secondary Academy Physical KS1">item 1</li>

但它没有显示任何匹配项我可以让它只使用一个值，但是我如何检查一个数据属性是否包含多个值，而不是 OR 而是 AND？

谢谢

【问题讨论】：

标签： jquery attributes

【解决方案1】：

另一种选择是使用多个选择器，然后对它们进行过滤。

项目 1 等等

然后你可以过滤：

// data-type1 AND data-type-2
if ($(this).find('[data-type1="Primary"][data-type-2="Academy"]').length) {
    //stuff
}

// data-type1 OR data-type-2
if ($(this).find('[data-type1="Primary"],[data-type-2="Academy"]').length) {
    //stuff
}

【讨论】：

【解决方案2】：

这样试试

$(".filterme").each(function() {
  if ($(this).data("type").indexOf("Secondary") > -1 && $(this).data("type").indexOf("Physical") > -1 && $(this).data("type").indexOf("KS1") > -1) {
    console.log($(this).data("type"));
  }
})

DEMO

【讨论】：

谢谢。我改变了 console.log($(this).data("type"));对于 $(this).show();及其完美