jQuery UI：droppable背景？

Question

我正在尝试创建一个垃圾桶，在你把一些物品放在那里之后，你可以简单地打开它并将任何被丢弃的物品从垃圾箱中拖出来拖出它。

我设置这个的方式是，我的网络应用程序有一个垃圾桶图标，我放下项目并单击垃圾桶打开一个包含已删除项目的框，并在黑色透明背景中淡化，遮盖其他所有内容，以便您只关注在垃圾箱上。

代码基本上是

<div id="background"></div>
<div id="trashcanContainer">
   <ul id="items">
     <li>item1</li>
     <li>item2</li>
   </ul>
</div>

背景CSS设置为固定位置和100％宽度和高度，并设置为可放置。问题是，当我从垃圾桶中拖出一些东西并将其放在背景上时，即使我将它放在垃圾桶的顶部，它也会被移除。基本上jQuery不知道trashcanContainer div是否在背景div之上（因此不是droppable的一部分），即使我定义的z-index高于背景。

有什么方法可以让我的工作吗？

Answer 1

确保#trashcanContainer绝对定位于position: absolute或position: fixed，否则z-index将无效。