java - 为 jQuery "sortable"问题重新排序 li 元素

标签 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)和(2)。

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

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

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

jsFiddle .

关于java - 为 jQuery "sortable"问题重新排序 li 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5797879/

相关文章:

JQuery.ready 来不及了 : How do I apply CSS Values with JQuery before Rendering?

java - 环境变量中的数据库名称

Java Compiled While 循环看起来不同

java - 如何在 spring-data 中使用 CrudRepository 强制预加载?

javascript - webpack 中是否可以有真正动态的 import() ?

javascript - 如何在 Polymer 2.0 on-tap 函数中传递参数?

javascript - 如何在javascript中检查我的文本框是否为空

jQuery hide() 不隐藏父级

java - 重写notifyDataSetChanged()不起作用

jquery - 将 on() 与悬停一起使用 - jQuery