Question

我有ul个各种项目，可以有几个可能的data-attribute值之一，如下所示：

<ul>
    <li id="li1" data-cat="one">test item
    <li id="li2" data-cat="one">test no 2
    <li id="li3" data-cat="two">test dummy
    <li id="li4" data-cat="three">test no 4
    <li id="li5" data-cat="three">more test
    <li id="li6" data-cat="three">test no 6
</ul>

我尝试使用jQuery选择每个不同 data-cat 值的第一项 - 因此，对于此示例，{{1} }，li#li1和li#li3。我尝试使用li#li4构建每个元素的数组，然后使用data-attribute进行排序

.unique

但是代码刚刚选择了所有元素（see fiddle here）

我已经找到了类似于this one的SO的答案，但它们似乎都依赖于预先知道var list = $( '[data-cat]' ).get(); listSorted = jQuery.unique( list ); $( listSorted ).addClass('active');值并搜索该特定值。是否可以选择具有特定data-attribute值的第一个元素而不事先指定值？

Answer 1

var cats = {};
var list = $( '[data-cat]' ).filter(function(){
    var category = $(this).data("cat");

    if(cats[category]){
        // category already accounted for, return false
        return false;   
    } else {
        // first of this category
        cats[category] = true;
        return true;
    }
});

http://jsfiddle.net/nB3ru/5/

使用jQuery选择具有不同数据属性的第一个元素

1 个答案: