0

序章

こんにちは、私は jQuery Isotope を使用して、さらに使用するために電子商取引テンプレートをモックアップしています。

同位体は単純ですが、特定のデータのカスタム範囲のフィルターを作成する方法を概説していません。

たとえば、価格帯に基づいて製品をフィルタリングすると、価格が 100 ～ 200 の製品が 1 つのフィルターになり、価格が 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>

等..

4

1 に答える 1

-1

少し下にスクロールして、ユーザー hdias の最初のコメントを見ると、これをうまく行うことができます。基本的に、価格帯の単純な条件が必要で、jQuery オブジェクトをフィルター オプションに渡します。

于 2012-08-17T22:45:50.157 に答える