Question

我有两个列表，每个列表中有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似乎根本不起作用，我无法将元素拖到其他列表中。

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

});

I have created a jsFiddle

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

Answer 1

您的问题在于float:left项目上的li ..您还需要将float:left添加到容器（即ul）以给它们一些高度

Updated your jsfiddle here

修正了将你的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()方法的节点上存储/检索数据

Working example here

jQuery sortable connectWith多个列表

1 个答案:

更新