Javascript jQuery可排序将元素从一个容器拖动到另一个容器

我的目标是让两个单独的容器彼此相邻。左边的容器将包含一个大的可拖动元素列表。右侧容器将包含几个相应的固定高度和宽度块，左侧的元素可以拖动到这些块中

我有点这样的工作现在，但它是非常有缺陷的，相当坦率地说，不工作很好。我制作了一个名为

drop

的容器，其中有几个

div

，不能进行排序。但是，我必须在禁用的div中插入一个嵌套的

div

，这样我才能真正地将对象拖动到每个块中。通过给

子容器

（禁用div中的嵌套div）`a高度和宽度，我实际上可以大大提高可用性

查看此内容以了解我的意思。（注意：右侧的块应该能够接受多个元素。例如：

右侧的项目符号

应该能够将左侧的

项目符号1、项目符号2和项目符号3拖入其中。）

希望这是有意义的

下面是一些代码：

<div id="wrapper">
    <div id="origin" class="fbox"></div>
    <div id="drop" class="fbox"></div>
</div>

我希望我能理解你的问题，我建议你为所有链接的
可排序的
框设置一个类名。它很简单，剩下的就是CSS

看一看:

jQuery：

$(function(){

  $('.sortme').sortable({
        connectWith: '.sortme'
  }).disableSelection();

});

HTML:


披萨
法令
吉普车
猫
狗
我并不清楚具体的问题是什么，或者您无法实现的期望行为是什么。
$(function(){

  $('.sortme').sortable({
        connectWith: '.sortme'
  }).disableSelection();

});

<div id='elePool' class='sortme'>
  <div>Pizza</div>
  <div>Fiat</div>
  <div>Jeep</div>
  <div>Cat</div>
  <div>Dog</div>
</div>
<div id='eleGroups'>
  <div class='sortme group group-food'></div>
  <div class='sortme group group-cars'></div>
  <div class='sortme group group-animals'></div>
</div>