jQuery sortable connectWith多个列表

我有两个列表，每个列表中有8个列表元素。 我想将任一元素拖到任一列表中，并将两个列表的总顺序放在一起。

目前，订单被归类为两个单独的可排序列表：

[0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7] 

但是我希望它（显然是元素的顺序）：

 [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15] 

参数connectWith似乎connectWith不起作用，我无法将元素拖到其他列表中。

 $(document).ready(function() { $('#list-1, #list-2').sortable({ connectWith: '.group', update: function(event, ui) { var orders = new Array(); $('#console').html('posts[id] = pos:
'); $('.group li').each(function(i) { var order = $(this).index(); var id = $(this).attr('data-post-id'); orders.push(order); }); console.log(orders) } }); }); 

我创建了一个jsFiddle

任何人都可以提出任何建议，为什么这不起作用？

Answer 1

你的问题是float:left的li项…你需要添加float:left的容器（即ul ）给它们一些高度

在这里更新了你的jsfiddle

修复正在改变你的CSS

 ul { list-style: none; float:left; } 

更新

要获得订单，请尝试以下方法：

 $('.group li').each(function(i) { var id = $(this).data('post-id'); orders.push(parseInt(id.substr(id.indexOf('-')+1))); }); console.log(orders) 

注意：您应该使用.data（）在节点上存储/检索数据而不是attr()方法

这里的工作示例