【发布时间】：2012-07-29 21:19:53
【问题描述】：
我有三类控件，每类都有几个选项：
<ul class="series-selector-items">
<li id="filter-type-A">A</li>
<li id="filter-type-B">B</li>
<li id="filter-type-C">C</li>
</ul>
<ul class="series-selector-items">
<li id="filter-type-E">E</li>
<li id="filter-type-F">F</li>
<li id="filter-type-G">G</li>
</ul>
<ul class="series-selector-items">
<li id="filter-type-H">H</li>
<li id="filter-type-I">I</li>
<li id="filter-type-J">J</li>
<li id="filter-type-K">K</li>
</ul>
然后我有一个列表，其中包含来自上述控件的属性组合的项目：
<ul>
<li class="A E H">Item AEH</li>
<li class="A F I">Item AFI</li>
<li class="A G J">Item AGJ</li>
<li class="A G H">Item AGH</li>
<li class="B E H">Item BEH</li>
<li class="B F H">Item BFH</li>
<li class="B F H">Item BFH</li>
<li class="C E I">Item CEI</li>
<li class="C G K">Item CEI</li>
etc etc...
</ul>
我正在尝试找到一种方法来根据所选控制选项的组合过滤结果。我需要能够选择控制选项的任意组合（例如 A E H）并显示所有具有正确属性的项目（项目 AEH）。
每个类别中应可选择多个选项 (A B E K)，并且类别应协同工作以显示具有正确元素组合的选项。如果从同一类别中选择了多个选项，它们的结果仍应显示。 我已将控制列表设为 li，但它们也可以是复选框。
用 jQuery 最好的方法是什么？
编辑：这是我迄今为止尝试过的一种方法，将选定的选项添加到数组中：
var seriesSelected = [];
$('ul.series-selector-items').click(function(){
//Select the series clicked and give it the "selected" class
$(this).toggleClass("selected");
//Once selected, add the series to the seriesSelected array
if ($(this).hasClass('selected')) {
seriesSelected.push($(this).attr('id'));
}
//If de-selecting (by toggling off the "selected class"), then remove from the seriesSelected array
else {
seriesToRemove = $(this).attr('id');
seriesSelected = $.grep(seriesSelected, function(value) {
return seriesToRemove != value;
});
}
});
不知道从那里去哪里......
【问题讨论】：
-
您尝试过什么吗？您是否遇到特定问题？
-
StackOverflow 101：尝试一下并发布一些代码。然后我们会为您修复它。 :)
-
是的，请向我们展示您到目前为止所做的事情！
-
我根据一些类似的问题尝试了几种不同的方法，但它们无法显示来自同一类别的多个选项stackoverflow.com/a/6527773