按多个数据属性元素过滤 [英] Filter by multiple data attribute elements

问题描述

如果data属性具有所有select选项值，而不仅仅是具有一个或另一个属性，我有一些要使用selects进行过滤的列表项.

<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?

谢谢

解决方案

尝试这样

$(".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

I've got some list items i want to filter using selects if the data attribute has all of the select option values not just if it has one or another.

<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>

I have some select boxes firing an onchange event which first hides all items

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

And i then want to show if a data attribute contains all values passed to it. I tried

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

Which i want to show this one

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

But it doesnt show any matches I can get it to work with just one value, but how do i check if a data attribute contains multiple values, not OR but AND?

thanks

解决方案

Try like this

$(".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

这篇关于按多个数据属性元素过滤的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！