2012-06-04 5 views
0

다양한 항목 (div.item)을 사용하여 동적으로 생성 된 페이지가 있습니다. 각 항목에는 "date"클래스가있는 내부 div가 있습니다. 항목은 날짜 값에 따라 DB에서 오름차순으로 정렬됩니다. DB에서 가져온이 페이지 콘텐츠에는 동일한 날짜의 항목이 10 개있을 수 있으므로 다음 3 개는 날짜를 공유하고 다음 X는 다른 날짜를 공유 할 수 있습니다.비슷한 콘텐츠를 기반으로 동적으로 생성 된 콘텐츠를 그룹화하는 방법

div.date의 내용을 기반으로 div.group에 비슷한 날짜의 항목을 모두 포장하고 싶습니다. PHP 코드에서 직접적으로이 작업을하는 것이 더 좋았지 만 문서가없는 큰 프로젝트를 물려 받았고이 옵션은 일시적인 것입니다.

<div class="item"> 
    <div class="date">04-06-2012</div> 
    <div class="other-content">Other Content</div> 
</div> 
<div class="item"> // To be grouped with above 
    <div class="date">04-06-2012</div> 
    <div class="other-content">Other Content</div> 
</div> 
... 
<div class="item"> // In it's own group 
    <div class="date">08-06-2012</div> 
    <div class="other-content">Other Content</div> 
</div> 
... 

감사

답변

3

이 그룹을 뜻 날짜별로 모든 항목 및 bodydiv.group 요소를 추가 : 현재 단순화 된 구조는 아래와 같다.

var groups={} 
$('div.item').each(function() { 
    var dt = $(this).find ('.date').text() 
    groups[dt] = groups[dt] || [] 
    groups[dt].push (this) 
}); 
$.each (groups, function(k, v) { 
    var group = $('<div/>').addClass('group') 
    $.each (v, function(k, item) { 
     $(item).detach().appendTo (group) 
    }); 
    group.appendTo ('body') //or wherever you need to append it 
}); 
+0

완벽하게 작동합니다. 감사. 실제로 jQuery를 사용하면로드 시간이 길어질 것이라고 생각했지만 약 70 개의 "항목"이있는 페이지에서 문제없이 테스트했습니다. – Tadtoad

관련 문제