jQuery Isotope 按范围过滤

Question

简介

您好，我正在使用 jQuery Isotope 来模拟一个电子商务模板以供进一步使用。

同位素很简单，但他们没有概述如何为某些数据的自定义范围创建过滤器。

例如，我可能想根据价格范围过滤产品，因此价格在 100-200 之间的产品成为一个过滤器，价格在 200-300 之间的产品成为另一个过滤器，依此类推。

基本上我希望有多个价格过滤器并定义每个过滤器可以具有的特定值。

我怎样才能做到这一点？

代码示例

我正在使用同位素文档中所写的标准 JS 代码：

    var $container = $('#list');

   $container.isotope({
     itemSelector : '#list li',
     masonry : {
              columnWidth : 1
            },
     getSortData : {
          price : function( $elem ) {
         return parseInt( $elem.find('.price').text(), 10 );
       },
     }

等等……

html基本上是

 <ul id="list">

   <li class=="item">
     <span class="price">555</price>
   </li>

    <li class=="item">
     <span class="price">222</price>
   </li>

 </ul>

等等。

Answer 1

如果您向下滚动一点，您可以通过looking here at user hdias' first comment 很好地完成此操作。基本上，您需要一个简单的价格范围条件，然后将 jQuery 对象传递给过滤器选项。