将元素拖放到容器中失败，因为元素太多

Drag and Drop Element into a Container fails with too many elements

本文关键字：元素 失败 太多 因为 拖放      更新时间：2023-09-26

我正在尝试使用拖放将<li>元素从一个<ul>移动到另一个<ul>。我已经把它发挥到了一定的作用。我的问题是，当<li>元素位于我的<ul>容器中的另一个<li>元素上时，我不能"丢弃"它。因此，当我填满容器的可见部分时，我就不能再拖放了。

这个CodePen演示了我的问题。

如果您想要下降目标，则不确定您正试图实现什么要放大以适应，请确保在目标上设置CSS样式文本大小使用px定义而不是pt规范。

然后每次发生掉落时，添加到您的掉落例程中以增加大小放置目标的像素高度乘以1行文本的像素高度。所以它在每滴，或者高度等于lineHeight x（numElements+1）总是给你留有再放1滴的空间

如果你想保持投放目标的固定大小要在页面中向下移动其他元素，请使用上面提到的放置目标并将其放入具有可滚动属性的固定大小div中。

这样就有了一个可以如上所述生长的drop元素，但是固定的div限制了屏幕的真实属性，因此drop目标不会占用的空间超过您想要的

我解决了我的问题。我不得不在handleDragOver函数中注释掉一个if语句，该语句检查event.target是否是dropzone元素。我还将handleDrop函数更改为使用event.currentTarget而不是event.target

相关文章：