javascript - 当 Jquery UI 的左上角进入内部时，如何使 Jquery UI 的 Droppable 接受 Draggable？

Question

关闭。此题需要 details or clarity 。目前不接受答案。

---

想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题.

已关闭 5 年前。

Improve this question

经过一些测试，我的 Droppable元素仅接受 Draggable当 Draggable 的中心位于 Droppable 中时的元素。

当左上角位于 Droppable 内部时，如何更改此行为以接受 Draggable？

注意:Draggables 比 Droppables 更大。

Answer 1

也许 droppable's tolerance option 的一些非默认值对您来说可能是一个不错的选择，尽管他们不会完全按照您的要求行事。

来自文档:

Specifies which mode to use for testing whether a draggable is hovering over a droppable. Possible values:

• "fit": Draggable overlaps the droppable entirely.
• "intersect": Draggable overlaps the droppable at least 50% in both directions.
• "pointer": Mouse pointer overlaps the droppable.
• "touch": Draggable overlaps the droppable any amount.

默认值为“相交”。我会考虑使用“pointer”或“touch”。

或者，如果您确实需要使用左上角作为引用，那么您应该覆盖 $.ui.intersect，该函数负责检查 Dragabble 和基于公差模式的可删除相交。如果是的话，它应该返回 true ，否则返回 false 。它看起来像这样:

$.ui.intersect = function (draggable, droppable, toleranceMode) {

    swtich(toleranceMode) {
        // Check if they intersect based on the selected mode.
        default:
            return false;
    }
}

您需要重新定义该函数并添加自定义 case block ，同时保留原始模式。否则，依赖于此的代码的其他部分(可能是其他 jQuery UI 组件)将会中断。

但是，这仅适用于 jQuery UI <1.12。如果您使用的是较新的版本，则必须覆盖其他一些方法。您可以在此处找到详细的答案及其代码示例:Build the matching option for jQuery UI Droppable's Intersect tolerance