jQuery

Question

sınıfına göre listeleme yeniden sıralama Öğeler listemi bir sınıf kullanarak yeniden sıralamak için basit bir yol var mı?

Aşağıda listelenen diğer liste öğeleriyle birlikte, listenin en üstündeki öğeleri öne çıkarmak için bir sınıf belirtmek istiyorum.

<ul class="order-me"> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
    <li class="featured">featured content</li> 
    <li class="">normal content</li> 
    <li class="featured">featured content</li> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
</ul> 

İstenilen çıktı:

<ul class="order-me"> 
    <li class="featured">featured content</li> 
    <li class="featured">featured content</li> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
    <li class="">normal content</li> 
</ul> 

teşekkürler!

Answer 1

.featured öğelerini, listenin en üstüne taşımak için ul içeriklerini ekleyebilirsiniz. Bu deneyin:

$('.featured').prependTo('.order-me'); 

Example fiddle

Answer 2

@Rory McCrossan cevabı eklemek için, ben gezinme düğmeleri ile sıralamak özelliğini ekledik

$("ul.order-nav li").click(function() { 
    // Find the Data attribute from unordered list [.order-nav] 
    var sortClass = '.' + $(this).data('sort-by'); 
    // Prepent the [li] with matching class to top of [ul] 
    $(sortClass).prependTo('.order-me'); 
}); 

Here is the Fiddle