2012-08-03 77 views
1

我正在使用同位素过滤器为项目排序模板列表。用户可以根据列宽(2列,3列,4列)或类型(文本,图片,视频)等选项进行过滤。有更多的选择,但这使得这个例子更简单。jQuery同位素插件添加剂过滤器

过滤器现在的工作方式是该项必须匹配所有过滤器选项。我希望能够筛选符合一个或多个筛选选项的项目。

第二个问题:是否有任何功能允许在步骤中进行过滤?例如,如果我可以显示所有2或3列的模板,然后将这些结果过滤到文本和视频模板。

我认为这可能超出了插件的范围,我可能必须编写自己的过滤器,找到不同的插件(至少用于过滤)或更改向用户呈现过滤的方式。

回答

2

我假设你有不同的类用于过滤,类似col2,col3,col4和文本,图像,视频,目前正在沿着'.col2.image'的线建立一个过滤器字符串,它可以让你看到横跨两列并且是图像的每一个元素。通过用逗号分隔它们,你会得到一个OR过滤器('.col2,.image'),它显示任何图像或跨越两列。

首先,您现在可以结合第二部分创建一个像'.col2.text,.col2.video,.col3.text,.col3.video'这样的过滤器,但是,这可能会变得很难看,尤其是当你增加类别的数量时。

为了简化,我修改了Isotope来接受一个过滤器数组,并将它们与多个过滤器调用链接在一起,但是,它听起来像也可以传入更复杂的过滤对象而不是字符串(https ://github.com/desandro/isotope/issues/144#issuecomment-4595552),它不需要修改同位素的来源。对于上面的示例中,这可以类似于:

$('.element').filter('.col2, col3').filter('.text, .video') 

比产生的可能的组合的字符串显著简单。

.filter(http://api.jquery.com/filter/)上的文档提供了有关高级筛选的更多信息。

+0

谢谢,关于逗号分隔的一部分,您可以轻松地为各种组合过滤正是我一直在寻找。我已经构建了一个字符串过滤器来传递,所以修改它并不会那么困难。如果我有代表,我会投你一票。再次感谢。 – 2012-08-03 19:30:55

+0

确保你删除了最后的','如果你正在构造字符串,否则你会得到一个错误。 – 2017-01-09 12:11:24

1
+0

感谢此代码。就像我上面所说的,如果我有代表,我会乐意为你提供帮助。 – 2012-08-03 19:32:54

+0

没问题。帮助是为了帮助 - upvotes是为bean计数器:) – Systembolaget 2012-08-03 21:49:31