我有点力不从心,我希望这是可能的。
我希望能够调用一个函数,该函数将按字母顺序对列表中的所有项进行排序。
我一直在寻找通过jQuery UI排序,但这似乎不是它。任何想法吗?
我有点力不从心,我希望这是可能的。
我希望能够调用一个函数,该函数将按字母顺序对列表中的所有项进行排序。
我一直在寻找通过jQuery UI排序,但这似乎不是它。任何想法吗?
当前回答
将列表放入一个数组中,使用JavaScript的.sort(),它默认是按字母顺序排列的,然后将数组转换回列表。
http://www.w3schools.com/jsref/jsref_sort.asp
其他回答
将列表放入一个数组中,使用JavaScript的.sort(),它默认是按字母顺序排列的,然后将数组转换回列表。
http://www.w3schools.com/jsref/jsref_sort.asp
就像这样:
var mylist = $('#myUL');
var listitems = mylist.children('li').get();
listitems.sort(function(a, b) {
return $(a).text().toUpperCase().localeCompare($(b).text().toUpperCase());
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });
来自本页:http://www.onemoretake.com/2009/02/25/sorting-elements-with-jquery/
以上代码将使用id 'myUL'对无序列表进行排序。
或者你也可以使用TinySort这样的插件。https://github.com/Sjeiti/TinySort
我想自己做这件事,我对提供的任何答案都不满意,因为我相信,它们是二次时间,而我需要在数百个项目的列表上做这件事。
我最终扩展了jquery,我的解决方案使用jquery,但可以很容易地修改为直接使用javascript。
我只访问每个条目两次,并执行一次线性排序,所以我认为,这应该在大型数据集上工作得更快,尽管我坦率地承认我可能错了:
sortList: function() {
if (!this.is("ul") || !this.length)
return
else {
var getData = function(ul) {
var lis = ul.find('li'),
liData = {
liTexts : []
};
for(var i = 0; i<lis.length; i++){
var key = $(lis[i]).text().trim().toLowerCase().replace(/\s/g, ""),
attrs = lis[i].attributes;
liData[key] = {},
liData[key]['attrs'] = {},
liData[key]['html'] = $(lis[i]).html();
liData.liTexts.push(key);
for (var j = 0; j < attrs.length; j++) {
liData[key]['attrs'][attrs[j].nodeName] = attrs[j].nodeValue;
}
}
return liData;
},
processData = function (obj){
var sortedTexts = obj.liTexts.sort(),
htmlStr = '';
for(var i = 0; i < sortedTexts.length; i++){
var attrsStr = '',
attributes = obj[sortedTexts[i]].attrs;
for(attr in attributes){
var str = attr + "=\'" + attributes[attr] + "\' ";
attrsStr += str;
}
htmlStr += "<li "+ attrsStr + ">" + obj[sortedTexts[i]].html+"</li>";
}
return htmlStr;
};
this.html(processData(getData(this)));
}
}
HTML
<ul id="list">
<li>alpha</li>
<li>gamma</li>
<li>beta</li>
</ul>
JavaScript
function sort(ul) {
var ul = document.getElementById(ul)
var liArr = ul.children
var arr = new Array()
for (var i = 0; i < liArr.length; i++) {
arr.push(liArr[i].textContent)
}
arr.sort()
arr.forEach(function(content, index) {
liArr[index].textContent = content
})
}
sort("list")
j挑战者演示https://j挑战者le.net970061nw/
在这里,我们将ul中li元素的所有值推入特定的id(我们作为函数参数提供)到数组arr中,并使用sort()方法对其排序,该方法默认按字母顺序排序。数组arr排序后,我们使用forEach()方法循环该数组,并将所有li元素的文本内容替换为排序内容
如果你正在使用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)是绝对错误的。