我有点力不从心,我希望这是可能的。
我希望能够调用一个函数,该函数将按字母顺序对列表中的所有项进行排序。
我一直在寻找通过jQuery UI排序,但这似乎不是它。任何想法吗?
我有点力不从心,我希望这是可能的。
我希望能够调用一个函数,该函数将按字母顺序对列表中的所有项进行排序。
我一直在寻找通过jQuery UI排序,但这似乎不是它。任何想法吗?
当前回答
为了使这个工作在包括Chrome在内的所有浏览器中工作,你需要使sort()的回调函数返回-1、0或1。
参见http://inderpreetsingh.com/2010/12/01/chromes-javascript-sort-array-function-is-different-yet-proper/
function sortUL(selector) {
$(selector).children("li").sort(function(a, b) {
var upA = $(a).text().toUpperCase();
var upB = $(b).text().toUpperCase();
return (upA < upB) ? -1 : (upA > upB) ? 1 : 0;
}).appendTo(selector);
}
sortUL("ul.mylist");
其他回答
为了使这个工作在包括Chrome在内的所有浏览器中工作,你需要使sort()的回调函数返回-1、0或1。
参见http://inderpreetsingh.com/2010/12/01/chromes-javascript-sort-array-function-is-different-yet-proper/
function sortUL(selector) {
$(selector).children("li").sort(function(a, b) {
var upA = $(a).text().toUpperCase();
var upB = $(b).text().toUpperCase();
return (upA < upB) ? -1 : (upA > upB) ? 1 : 0;
}).appendTo(selector);
}
sortUL("ul.mylist");
如果你正在使用jQuery,你可以这样做:
$(function() { var $list = $("#list"); $list.children().detach().sort(function(a, b) { return $(a).text().localeCompare($(b).text()); }).appendTo($list); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <ul id="list"> <li>delta</li> <li>cat</li> <li>alpha</li> <li>cat</li> <li>beta</li> <li>gamma</li> <li>gamma</li> <li>alpha</li> <li>cat</li> <li>delta</li> <li>bat</li> <li>cat</li> </ul>
注意,从compare函数返回1和-1(或0和1)是绝对错误的。
@SolutionYogi的答案很有魅力,但似乎使用$。这两种方法都不如直接添加列表来得直接和有效:
var mylist = $('#list');
var listitems = mylist.children('li').get();
listitems.sort(function(a, b) {
return $(a).text().toUpperCase().localeCompare($(b).text().toUpperCase());
})
mylist.empty().append(listitems);
小提琴
$(".list li").sort(asc_sort).appendTo('.list');
//$("#debug").text("Output:");
// accending sort
function asc_sort(a, b){
return ($(b).text()) < ($(a).text()) ? 1 : -1;
}
// decending sort
function dec_sort(a, b){
return ($(b).text()) > ($(a).text()) ? 1 : -1;
}
现场演示:http://jsbin.com/eculis/876/edit
你不需要jQuery来做这个…
function sortUnorderedList(ul, sortDescending) {
if(typeof ul == "string")
ul = document.getElementById(ul);
// Idiot-proof, remove if you want
if(!ul) {
alert("The UL object is null!");
return;
}
// Get the list items and setup an array for sorting
var lis = ul.getElementsByTagName("LI");
var vals = [];
// Populate the array
for(var i = 0, l = lis.length; i < l; i++)
vals.push(lis[i].innerHTML);
// Sort it
vals.sort();
// Sometimes you gotta DESC
if(sortDescending)
vals.reverse();
// Change the list on the page
for(var i = 0, l = lis.length; i < l; i++)
lis[i].innerHTML = vals[i];
}
易于使用…
sortUnorderedList("ID_OF_LIST");
现场演示→