jQuery UI droppable 在 jScrollpane 的可见区域之外捕获 drop 事件

Question

我有两个相邻的 jScrollPanes 包含可放置的 li 元素。第一个 div 在第二个 div 上方（在 y 轴上），因此来自顶部的溢出流“低于”它下方的一个（两者都是溢出：隐藏）。问题是，当我将一个可拖动元素拖放到下部 jScrollPane 中时，该事件会被上下 both 中的可拖放元素捕获，即使上部的元素位于可见区域之外它的容器。

如何防止“隐藏”元素（滚动窗格之外的元素）捕获放置事件？我尝试插入逻辑来测试 droppable 是 :hidden 还是 :visible，但这不起作用。使用 z-index 也不起作用。我想将 droppable() 处理程序委托给容器，而不是将它放在 li 上，但不支持。

Answer 1

我通过使用this answer 并修改它以使用jScrollPane 解决了这个问题。不同之处在于您需要考虑两个不同的父母。其他解决方案中引用的“父级”的大小可以从$(this).closest(".jspContainer") 获得，但您还需要考虑可视区域的偏移量。如果您只是垂直滚动，则偏移量为parseInt(#(this).closest(".jspPane").css("top")。