在jQuery选择器中混合使用逻辑AND和OR

Question

我必须过滤包含两个关键数据属性的项目列表:

<li class="song" data-title="freedom" data-id="7" data-tags="tag-18-eot,tag-2-eot" data-category="1">Freedom</li>

1. 类别
2. 标签

按类别过滤应按逻辑OR进行,但按标记过滤应按逻辑AND过滤.

使用这两个中的一个进行过滤不是问题.

我申请了,例如:

$(collection).filter('li[data-tags*="tag-50-eot"][data-tags*="tag-51-eot"]');

按标签过滤.要么:

$(collection).filter('[data-category="1"], [data-category="2"]);

按类别过滤.

这很好用.但是,我找不到一种方法将这两个选择器组合成一个我可以传递给filter()函数的单个查询,并且链接两个filter()调用不会产生所需的结果,因为第一个调用可能会过滤掉第二个调用的项目忘在脑后.

我发现这个问题有类似的话题,但问题有点不同,方法也是如此.

如何正确过滤这些项目？

Answer 1

只要您AND首先使用条件,您就应该能够通过链接获得所需的内容.例如:

var res = $('#collection li')
    .filter('li[data-tags*="tag-50-eot"][data-tags*="tag-51-eot"]')
    .filter('[data-category="1"], [data-category="2"]'); 

小提琴这里.