如何在jQuery中使用自定义排序顺序对列表项进行排序

我的问题与我在Stack Overflow上发现的其他一些问题非常相似，但并不完全相同。

我想根据每个项目中包含的跨度内容对列表项进行排序 – 但是使用我可以定义的排序顺序。 这是示例列表项的HTML：

 John Doe Sophomore  

我想根据“年”跨度的内容进行排序，但是按时间顺序而不是按字母顺序排序。 显然，订单必须是：

• 新生
• 二年级
• 初级
• 前辈

我怎样才能做到这一点？

仅供参考，我使用以下jQuery代码（完美地工作）按姓氏按字母顺序排序：

 function sortByLastName(){ var myList = $('#foo ul'); var listItems = myList.children('li').get(); listItems.sort(function(a,b){ var compA = $(a).find('.lname').text().toUpperCase(); var compB = $(b).find('.lname').text().toUpperCase(); return (compA  compB) ? 1 : 0; }); $(myList).append(listItems); }; 

Answer 1

要匹配sortByLastName（）函数，这将起作用：

 function sortByYear(){ var myYears = ['Freshman', 'Sophomore', 'Junior', 'Senior']; var myList = $('#foo ul'); var listItems = myList.children('li').get(); listItems.sort(function(a,b){ var compA = $.inArray($(a).find('.year').text(), myYears); var compB = $.inArray($(b).find('.year').text(), myYears); return (compA < compB) ? -1 : (compA > compB) ? 1 : 0; }); $(myList).append(listItems); } 

只需使用$ .inArray（）来查找数组中每个学年的索引。 请注意，对于数组中未找到的值，这将返回-1，这将把这些元素放在列表的顶部。

Answer 2

一种简单的方法是使用您的预期值创建一个数组。

 var years=['Freshman', 'Sophomore', 'Junior', 'Senior' ]; 

然后在对元素进行排序时，比较索引。

 listItems.sort(function(a,b){ var indexA = $.inArray( $(a).find('.year').text(), years ); var indexB = $.inArray( $(b).find('.year').text(), years ); return ( indexA < indexB) ? -1 : ( indexA > indexB) ? 1 : 0; }); 

Answer 3

您必须更改排序条件回调。 像这样：

 function sortByLastName(){ var myList = $('#foo ul'); var listItems = myList.children('li').get(); var scores = { "FRESHMAN": 0, "SOPHOMORE": 1, "JUNIOR": 2, "SENIOR": 3 }; listItems.sort(function(a,b){ var compA = $(a).find('.lname').text().toUpperCase(); var compB = $(b).find('.lname').text().toUpperCase(); compA = scores[compA]; compB = scores[compB]; //Sort by scores instead of values return (compA < compB) ? -1 : (compA > compB) ? 1 : 0; }); $(myList).append(listItems); }; 

希望这可以帮助