问题描述
我在基于数组排序时遇到问题。 假设我有这样的事情：
HTML：
<button onClick="sortfunc();">Sort</button>
<ul id="sortable">
<li id="a">is </li>
<li id="b">awesome</li>
<li id="c">very </li>
<li id="d">javascript </li>
<li id="e">hard </li>
<li id="f">but </li>
</ul>
现在，我想使用一个外部按钮对其进行排序，并将最终值排序为等于dacefb顺序。
使用Javascript：
$(function() {
$( "#sortable" ).sortable();
});
function sortfunc() {
var idsInOrder = $("#sortable").sortable("toArray");
console.log(idsInOrder);
//Print: ["a", "b", "c", "d", "e", "f"]
var sorttoarray = ["d","a","c","e","f","b"];
//Do something here to sort the ul li to match sorttoarray
}
我打印出数组，但顺序不符合预期。 是否可以使用外部按钮按照指示将上面的可排序对象分类为ID？
编辑，所以ID以字母开头。
1楼
Thomas Stringer
1
已采纳
2015-07-30 19:38:10
这是完成此操作的方法（由于您不需要jQuery UI可排序功能，我对HTML进行了一些更改）：
<button id="doSomething">Sort</button>
<ul id="sortable">
<li id="1">is </li>
<li id="2">awesome</li>
<li id="3">very </li>
<li id="4">javascript </li>
<li id="5">hard </li>
<li id="6">but </li>
</ul>
这是我的JavaScript：
function sortfunc() {
var liItems = $("#sortable li");
var sorttoarray = ["4","1","3","5","6","2"];
$("#sortable").empty();
for (var i = 0; i < sorttoarray.length; i++) {
$("#sortable").append(liItems.filter("#" + sorttoarray[i]));
}
}
$("#doSomething").click(function () {
sortfunc();
});
这是工作中的jsfiddle： :
最终，我在这里所做的就是省去li元素，清空父ul ，然后遍历该数组以获取该顺序，当我到达该顺序中的下一个所需元素时，只需append()其append()返回。