2013-09-30 3 views
0

내가 데이터를 기반으로 목록을 정렬하는 jQuery 플러그인을 속성을 만드는 오전 속성 :고유 한 데이터를 확인하고

내가, 내가 할 수있게하려면 얼마나 많은 데이터가 추가됩니다 속성을 모르는 것처럼
<ul class="reorder"> 
    <li data-rating="1" data-category="3">Rating 1 - Category 3</li> 
    <li data-rating="5" data-category="1">Rating 5 - Category 1</li> 
    <li data-rating="2" data-category="2">Rating 2 - Category 2</li> 
    <li data-rating="7" data-category="1">Rating 7 - Category 1</li> 
    <li data-rating="21" data-category="3">Rating 21 - Category 3</li> 
    <li data-rating="19" data-category="2">Rating 19 - Category 2</li> 
</ul> 

다음,

<ul class="reorder-nav"> 
    <li><a href="#" data-sort="rating">Sort by rating</a></li> 
    <li><a href="#" data-sort="category">Sort by category</a></li> 
</ul> 

내 기본적인 아이디어는 각 목록 항목을 통해 루프이며, 데이터 속성의 배열을 만들 : 목록을 반복하고 식별 고유 한 데이터 속성 (해당 속성의 값이 아니라) 링크의 세트를 만들 수 있습니다 고유 한 속성에 대해 해당 배열을 필터링하십시오.

.data()으로 모든 데이터 속성의 배열을 만들 수 있습니다. 그러나 나는 조금 꼼짝도하지 않아서 어떤 제안도 감사 할 것입니다.

답변

2

당신은 데이터-X 속성 이름을 추출하기 위해이 같은 작업을 수행 할 수 있습니다

var uniqueAttrs = {}; 
$('.reorder li').each(function(){ 
    $.each(this.attributes, function(_,a){ 
    if (a.name.indexOf('data-')===0) { 
     uniqueAttrs[a.name.slice(5)] = 1; 
    } 
    }); 
}); 

는 그런 다음 uniqueAttrs의 열쇠를 반복 할 수 있습니다

for (var attr in uniqueAttrs) { 
    console.log(attr); // for example "sort" or "ranking" 
} 

을 당신이를 지원하기 위해 줄 수있는 경우 제한된 브라우저 세트를 사용하는 경우 attributes 대신 dataset을 사용하여 루프를 단순화 할 수 있습니다.

+0

이것은 완벽하게 질문에 대답하는 견고한 해결책입니다. – gethyn1

관련 문제