jQuery对两个相同的列表进行排序，对另一个列表进行排序，也按相同的顺序进行排序

我得把两个相同的ul分类 具有相同的类和相同的li元素 如果用户在一个ul上执行排序，则应执行相同的操作 另一方面

code:

<ul class="sort">
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>


<ul class="sort">
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>

列表是克隆的，即如果我执行jquery操作，两者都是相同的 在一个列表中排序然后它应该在同一时间以相同的顺序对两个列表进行排序

我正在为此使用jquery ui：

 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>



 <script>
 $(function() {
 $( ".sort").sortable().disableSelection();
 });
 </script>

这些变化应该是什么

 <script>
 $(function() {
 $( ".sort").sortable().disableSelection();
 });
 </script>

分段以使其工作。

试试这个

<ul class="sort1">
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>


<ul class="sort2">
<li>a</li>
<li>c</li>
<li>b</li>
<li>d</li>
</ul>
<ul class="sort2">
<li>a</li>
<li>c</li>
<li>b</li>
<li>d</li>
</ul> 


 <script>
 $(document).ready(function(){
 $(".sort1").sortable();
     $(".sort1").disableSelection();
    $(".sort2").val($(".sort1").val());

})
 </script>

---

这有点粗糙，但在更新事件函数中，您可以使用排序后的内容重新填充另一个HTML

代码：

演示：

使现代化 创建了一个更好的解决方案，而不是重新创建列表，而是根据移动的元素切换所有元素

代码：

---

演示：

这不起作用一次只有一个列表在排序我想同时对这两个列表进行排序。@请给出原因…或更好的解决方案，而不是此方法不起作用。查看您的最新小提琴。不是对元素进行排序是的，但这里有一个问题，它正在替换li类，即在对所有列表li类进行排序后，if和其他列表是相同的。@user3706494这不是第一个问题/代码中的要求；我将相应地更改代码

 $(function () {
     $(".sortable").sortable({
         update: function (event, ui) {
             $(".sortable").not($(this)).html($(this).html());
         }
     }).disableSelection();
 });

$(function () {
    $(".sortable").sortable({
        start: function (event, ui) {
            $(this).data("elPos", ui.item.index());
        },
        update: function (event, ui) {
            var origPos = $(this).data("elPos");
            $(".sortable").not($(this)).each(function (i, e) {
                if (origPos > ui.item.index()) {
                    $(this).children("li:eq(" + origPos + ")").insertBefore($(this).children("li:eq(" + ui.item.index() + ")"));
                } else {
                    $(this).children("li:eq(" + origPos + ")").insertAfter($(this).children("li:eq(" + ui.item.index() + ")"));
                }
            })
        }
    }).disableSelection();
});