同位素sortByValue

Question

我想我的产品排序，但这似乎没有工作，我没有错误的..我试图做的是那种产品“名”和“fname”先

<div class="w-filters"> 
<div class="w-filters-item active" data-sort-by="*">All</div> 
<div class="w-filters-item" data-sort-by=".name">Name</div> 
<div class="w-filters-item" data-sort-by=".fname">FolderName</div> 
</div> 

与这个jQuery

jQuery('.w-portfolio.type_sortable').each(function(index, container){ 
    var $container = jQuery(container), 
     $list = $container.find('.w-portfolio-list'), 
     $sortItems = $container.find('.w-filters-item'); 
     $container.imagesLoaded(function(){ 
     $list.isotope({ 
      itemSelector: '.w-portfolio-item', 
      layoutMode: 'fitRows', 
      getSortData: { 
       name: '.name', 
       fname: '.fname', 
      } 
     }); 
     $sortItems.click(function(){ 
       var $item = $item.attr('data-sort-by'); 
       if ($item.hasClass('active')) return; 
       $sortItems.removeClass('active'); 
       $item.addClass('active'); 
       $list.isotope({ 
        sortBy: sortByValue 
       }); 
      }); 
     }); 
}); 

一些一谁知道解决这一问题？

Answer 1

你的小提琴有几个问题。您可以在“外部资源”下添加类似于同位素的库，而不是在JavaScript窗格中，因为很难看到您的代码。另外，imagesLoaded.js不是同位素v2的一部分（它在v1.56中），所以你也需要包含它。此外，没有排序“全部”，这是为了过滤，所以我添加了原始顺序。 我在你的代码上做了一些改写。 这里是工作jsfiddle

jQuery('.w-portfolio.type_sortable').each(function(){ 
    var $list = jQuery('.w-portfolio-list'), 
    $sortItems = jQuery('.w-filter'); 
    $list.imagesLoaded(function(){ 
    $list.isotope({ 
     itemSelector: '.w-portfolio-item', 
     layoutMode: 'fitRows', 
     getSortData: { 
      name: '.name', 
      fname: '.fname' 
     } 
    }); 
    $sortItems.on('click','div',function(){ 
     var sortByValue = jQuery(this).attr('data-sort-by'); 
$list.isotope({ sortBy: sortByValue });    
     }); 
    }); 

$sortItems.each(function(i, sortGroup) { 
var $sortGroup = jQuery(sortGroup); 
$sortGroup.on('click', 'div', function() { 
    $sortGroup.find('.active').removeClass('active'); 
    jQuery(this).addClass('active'); 
}); 
}); 
});