2014-01-07 213 views
1

我排序,看起來像這樣的列表:排序錨不排序嵌套列表

<ul class = "demoOne"> 
    <li><a href="http://somelink.com">Some text</a></li> 
    <li><a href="http://somelink.com">Some more text</a> 
    <ul> 
     <li><a href="http://somelink.com">Some nested text</a></li> 
     <li><a href="http://somelink.com">Some more nested Text</a></li> 
     <li><a href="http://somelink.com">Even more nested Text</a></li> 
    </ul> 
    </li> 
    <li><a href="http://somelink.com">Still more text</a></li> 
    <li><a href="http://somelink.com">Even more text</a></li> 
</ul> 

我發現這個解決方案在another question

$(function() { 
    $.fn.sortList = function() { 
    var mylist = $(this); 
    var listitems = $('li', mylist).get(); 
    listitems.sort(function(a, b) { 
     var compA = $(a).text().toUpperCase(); 
     var compB = $(b).text().toUpperCase(); 
     return (compA < compB) ? -1 : 1; 
    }); 
    $.each(listitems, function(i, itm) { 
     mylist.append(itm); 
    }); 
    } 

    $("ul#demoOne").sortList(); 

}); 

我」問題我的意思是,這需要我所有的嵌套鏈接並將它們插入到外部列表中。

所以我最終得到的是,像這樣的列表:

  • 更嵌套文本
  • 更文本
  • 有些多個嵌套文本
  • 一些嵌套文本
  • 更多文字
  • 部分文字
  • 更多文字

我該如何解決這個問題?

只是學習jQuery和完全失去了我在這裏的深度,所以請去容易。

回答

1

對我來說這感覺有點不好意思,但我最終這樣做的方式是向父母李的添加一個可排序的類。

<ul class = "demoOne"> 
    <li class="sortable"><a href="http://somelink.com">Some text</a></li> 
    <li class="sortable"><a href="http://somelink.com">Some more text</a> 
    <ul> 
     <li><a href="http://somelink.com">Some nested text</a></li> 
     <li><a href="http://somelink.com">Some more nested Text</a></li> 
     <li><a href="http://somelink.com">Even more nested Text</a></li> 
    </ul> 
    </li> 
    <li class="sortable"><a href="http://somelink.com">Still more text</a></li> 
    <li class="sortable"><a href="http://somelink.com">Even more text</a></li> 
</ul> 

然後我抓住並按類名排序這些li。

$('.sortable').not(".sortable li").sort(function(a, b){ 
     return $('a', a).text() > $('a', b).text(); 
    }).appendTo(".current"); 

我仍然喜歡看到一種方法來做到這一點,而不使用額外的類。如果有人知道如何做到這一點,我很樂意接受這個答案,並接受作爲更好的答案。