Javascript JQuery可拖动堆栈在删除后中断

我正在使用JQuery将可拖动的铭牌放入网站的插槽中。一切都很好，但我的堆栈有一些问题。从初始状态开始，堆栈工作正常。所有被拖动的卡始终位于所有其他元素之上

问题发生在其中一个铭牌掉到可放下的位置后。任何先前在脚本中设置为draggable的draggable都将在drop铭牌下传递。这就好像丢弃的铭牌以某种方式删除了堆栈属性

其预期功能是使可拖动设备始终位于顶部，无论其被丢弃多少次。我不确定CSS是否在干扰。我对这些语言不太熟悉

这是在我的代码中设置可拖动的：

$('#rikishi_card.Gen'+i+'e').draggable( {
      cursor: 'move',
      revert: 'invalid',
      stack: '#rikishi_card'
} );

然后设置dropzone：

$('#rikishi_slot.Gen'+i+'w').droppable( {
    accept: '#rikishi_card',
    drop: handleDrop
    } );

下面是一些示例代码：

尝试将Gen1w向下拖动到new。它将成功地跳过其他卡。然后将Gen1e拖到Gen1w。它将在Gen1w下通过。

---

生成顺序为Gen1e->Gen1w->Gen2e->Gen2w

我将rikishi_卡从ID更改为class，GenX则相反。现在似乎开始工作了。

我将rikishi_卡从ID改为class，GenX则相反。现在似乎正在工作。

我想如果我将所有元素移到新区域，堆栈功能就会恢复。但有时它会再次破裂。然后通过释放拖动然后重试来再次恢复。我想如果我将所有元素移到新区域，堆栈功能就会恢复。但有时它会再次破裂。然后通过释放阻力然后重试再次恢复。