Question

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

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

Answer 1

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

这是你需要的吗？

修改这是对的吗？

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

编辑最后（我希望）

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

从选择中创建过滤器（同位素）

1 个答案: