0

我有四个级别的过滤器，基本上是：格式、区域、人口统计和兴趣。

<div class="form-div">
  <input type="checkbox" data-filter="i-newspaper">
  <input type="checkbox" data-filter="i-magazine">
</div>

<div class="form-div">
  <input type="checkbox" data-filter="i-northland">
  <input type="checkbox" data-filter="i-southland">
</div>

<div class="form-div">
  <select>
    <option value="4" data-filter="i-digital">Digital</option>
    <option value="1" data-filter="i-manufacturing">Manufacturing</option>
    <option value="2" data-filter="i-retail">Retail</option>
  </select>
</div>

<div class="form-div">
  <input data-filter="i-business-and-finance" type="checkbox">
  <input data-filter="i-careers-and-education" type="checkbox">
  <input data-filter="i-design-and-photography" type="checkbox">
</div>

同位素过滤器基于上面检查/选择的内容。

我正在使用这样的东西：

var selectors = [];
$(".form-div").find("input:checked, option:selected").each(function(){
  selectors.push('.'+$(this).data('filter'));
});
selectors = selectors.join('');

它提供了一个选择器.i-newspaper.i-magazine.i-northland.i-southland.i-digital.i-design-and-photography（假设这些是选中/选中的表单元素）

然而，每一个.form-div都是一个单独的集合，所以通过上面的选择，我希望得到：

.i-newspaper.i-southland.i-digital.i-design-and-photography,
.i-newspaper.i-northland.i-digital.i-design-and-photography,
.i-magazine.i-southland.i-digital.i-design-and-photography,
.i-magazine.i-northland.i-digital.i-design-and-photography

如何实现这样的目标？

如果我的问题需要更多澄清，请告诉我...

谢谢

编辑

此问题的另一种替代解决方案是“多级”过滤。

所以按这个集合过滤：.i-newspaper, .i-magazine

然后按此集合过滤子集：i-southland, .i-northland

等等等等...

EDIT2 JsFiddle：http: //jsfiddle.net/MkME9/

4

1 回答 1

1

看看我的编辑：http: //jsfiddle.net/MkME9/

这就是你需要的吗？

编辑 这是正确的吗？

http://jsfiddle.net/MkME9/6/

最后编辑（我希望）

http://jsfiddle.net/MkME9/9/

于 2012-09-24T04:22:37.923 回答