Question

我正在使用同位素来分类和过滤与不同产品的功能相关的许多瓷砖。有些瓷砖对每种产品都是独一无二的，而其他瓷砖则是共享的。当您在产品之间切换时，它会过滤切片以仅显示标记有相应类名的切片，但是，我想控制这些切片的顺序，因为每个产品的功能具有不同的优先级。如果我没有实现控制订单的任何方式，它们按照它们在标记内的顺序出现，这意味着第一个产品的功能将成为标记中后续产品的第一个图块。

我想找出最有效的方法来做到这一点。现在我添加了属性：

瓦片

<div id="feature1" class="isotope-item productA productB" productAOrder="1" productBOrder="2">
Feature 1
</div>

<div id="feature2" class="isotope-item productA productB" productAOrder="2" productBOrder="1">
Feature 2
</div>

jQuery / Isotope代码

$container.isotope({
    getSortData: {
        productA: function ($elem) {
            return parseInt($elem.hasClass('productA').attr('productAOrder').text(), 10);
        },
        productB: function ($elem) {
            return parseInt($elem.hasClass('productB').attr('ProductBOrder').text(), 10);
        }
    }
});


$container.isotope({ filter: '.productA'});
$container.isotope({ sortBy: 'productA', sortAscending : true});

无论出于何种原因，我无法让瓷砖遵循我定义的顺序。有更好的方法吗？

Answer 1

jQuery的hasClass（）返回一个布尔值

$elem.hasClass('productB').attr('ProductBOrder').text()

抛出错误。

用hasClass('productB')替换filter('.productB')应该具有您正在寻找的效果，假设呼叫在那里，如果它不存在则返回0。

使用Isotope定义排序顺序

1 个答案: