jQuery를, 항목

Question

전에 날짜 삽입 I가 다음과 같은 마크 업 :

<ul> 
    <li data-date="May 2014">Content</li> 
    <li data-date="May 2014">Content</li> 
    <li data-date="May 2014">Content</li> 
    <li data-date="August 2014">Content</li> 
    <li data-date="August 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
</ul> 

내가 출력을 원하는 것은 : 그래서

<ul> 
    <li><h2>May 2014</h2></li> 
    <li data-date="May 2014">Content</li> 
    <li data-date="May 2014">Content</li> 
    <li data-date="May 2014">Content</li> 

    <li><h2>August 2014</h2></li> 
    <li data-date="August 2014">Content</li> 
    <li data-date="August 2014">Content</li> 

    <li><h2>November 2014</h2></li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
    <li data-date="November 2014">Content</li> 
</ul> 

, 기본적으로 같은 data-date 값을 포함 li 요소의 모든 그룹 전에 <li><h2>{{ data-date group name }}</h2></li>을 삽입하고 싶습니다.

난 다음 시도하여 실패이 동일한 값 data-date 요소, 그것은 모든 개별 요소를 대상 그룹을 대상으로하지 않는

$('li').each(function() { 
    $(this).before('<li><h2>' + $(this).attr('data-date') + '</h2></li>'); 
}); 

.

그래, 누군가가 이것을 도울 수 있다면 크게 감사하겠습니다.

Answer 1

var previousDataDate; 
$('li').each(function() { 
    if (previousDataDate != $(this).attr('data-date')) { 
     $(this).before('<li><h2>' + $(this).attr('data-date') + '</h2></li>'); 
    } 
    previousDataDate = $(this).attr('data-date'); 
}); 

Working Demo

Answer 2

첫 번째 발생 회수를 얻을 수를 필터링하는 경우 귀하의 코드가 작동 것이다 :

var $firstDates = $('li').filter(function() { 
    return $(this).data("date") != $(this).prev().data("date"); 
}); 

$firstDates.each(function() { 
    $(this).before('<li><h2>' + $(this).attr('data-date') + '</h2></li>'); 
});