为 jQuery“可排序”问题重新排序 li 元素答案

【问题标题】：Reordering li elements for jQuery "sortable" problem为 jQuery“可排序”问题重新排序 li 元素
【发布时间】：2011-04-27 00:01:05
【问题描述】：

我已经使用 jQuery UI 的可排序功能构建了一个可排序列表，这工作正常，除了我需要能够根据包含元素顺序的字符串在开头重新排序 <li>，但我无法弄清楚语法如何用 JavaScript 做到这一点。

假设我有以下内容：

<ul>
   <li id="A" >Apple</li>
   <li id="B" >Banana</li>
   <li id="C" >Carrot</li>
</ul>

和字符串“C,A,B”

我想要一个 JavaScript 函数来重新排序我里面的项目，它基于字符串的顺序排序。以这个结束：

 <ul>
   <li id="C" >Carrot</li>
   <li id="A" >Apple</li>
   <li id="B" >Banana</li>
</ul>

我会自然地用它的“，”将字符串拆分出来，并以一个元素 ID 的数组结尾，但我不确定其中的两个主要内容。

1) 获取指定 Id 在我的拆分字符串数组中找到的元素的最佳方法是什么？

2) 一旦我获得了该元素并确定它是正确的元素，将它们按正确顺序放置的语法或最佳策略是什么？

【问题讨论】：

【解决方案1】：

这应该同时回答 (1) 和 (2)。

您可以在, 分隔符上拆分字符串以获取一个数组，然后只需循环更改li 元素的顺序即可。

var order = 'C,A,B'.split(','),
    ul = $('ul');

$.each(order, function(index, sort) {
    $('#' + sort).appendTo(ul);
});

【讨论】：