重新排序li元素的jQuery“可排序”问题

时间:2011-04-27 00:01:06

标签: java javascript jquery jquery-ui-sortable html-lists

我使用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 个答案:

答案 0 :(得分:5)

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

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

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

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

jsFiddle