如何防止触发多个 jQuery UI droppables？

Question

我有一个 jQuery UI 可拖动 和几个单独定义的 droppables。 由于其中一个 droppable 已配置为 tolerance: 'intersect'，因此可以将一个可拖动对象同时放置到多种可放置对象上。

防止意外 droppable 触发的最佳方法是什么？ 基本上，我想优先考虑 droppables，以便在触发另一个 droppables 时，具有 tolerance: 'intersect' 的 droppables 不会被触发。

更新 - 用于澄清问题的更多信息：

• 所有 droppable 都配置了 tolerance: 'pointer'，除了一类 droppable 的 tolerance: 'intersect '。

• 一类 droppable 具有 tolerance: 'intersect' 的原因是 droppable 非常窄，用户在使用 tolerance: 'pointer' 找到它们时遇到问题。

• 将 droppable 移得更远不是一个选项。

• 所有 droppable 均不重叠，但可拖动对象足够大，可以与具有 tolerance: 'intersect' 的 droppable 重叠，同时鼠标指针位于另一个具有 tolerance: 'pointer'< 的 droppable 上< /代码>。 通过这种方式，最多可以同时触发两个 droppable。

• UI 的布局是为了在触发另一个 droppable 时忽略 tolerance: 'intersect' droppable 来确定用户的意图； 即，如果用户将鼠标指针移动到具有 tolerance: 'pointer' 的可放置对象上，则可以安全地假设他/她打算将其放置在那里。 问题是，我不知道如何忽略不需要的 droppable。

Answer 1

在 over: 中，为预期的 droppable 分配一个类，并从所有其他 droppable 中删除该类：

$(".dragArea").not($(this)).removeClass("dragHover");
$(this).addClass("dragHover");

然后在 drop: 中，检查该类是否已设置：

if(!$(this).is('.dragHover')){
    return false;
}

这样，仅触发了一个可掉落物。

Answer 2

也许在“不太喜欢”的可放置事件结束时，您可以检查可拖动是否也在“首选”可放置之上，以及是否禁用了“不太喜欢”的可放置。

抱歉使用术语，只是想集思广益。

Answer 3

将它们彼此保持一定的物理距离，这样它们就不会同时掉落。 否则，你应该如何确定用户的意图？ 您要计算每个相交可放置对象上可拖动对象的百分比吗？