droppable out 事件：如何获取鼠标移动到的元素答案

【问题标题】：droppable out event: How to get element where mouse moves todroppable out 事件：如何获取鼠标移动到的元素
【发布时间】：2019-11-07 11:48:23
【问题描述】：

在可退出事件期间，我需要鼠标光标移动到的元素。如果此元素不可放置，则应执行默认行为。

我尝试了以下方法：

            $(dropSelector).droppable({
            over: function (event, ui) {
                ui.helper.css("cursor", "copy");
                // Some code on drop enter here...
            },
            out: function (event, ui) {
                // New element: mouse pointer might move to another droppable element...
                // How to obtain the element where the mouse moves to?
                if (/* next element is NOT droppable*/) {
                    ui.helper.css("cursor", "no-drop");
                    // Some code on drop out here...
                }
            },
            drop: function (event, ui) {
                // handle drop event
            }
        });

但是，我找不到在out 事件期间获取鼠标光标移动到的元素的方法。我尝试了event.target 和event.currentTarget，但它们不是我要查找的元素。

【问题讨论】：

标签： jquery-ui events drag-and-drop

【解决方案1】：

我使用了不同的解决方案。显然，下一个元素的over 事件在旧元素的out 事件之前触发。所以我检查 out 目标是否是最后输入的元素。

    var _target = null;
    $(dropSelector).droppable({
        over: function (event, ui) {
            _target = event.target;
            ui.helper.css("cursor", "copy");
            // Some code on drop enter here...
        },
        out: function (event, ui) {
            if (_target === event.target) {
                // No 'over' occurred for a new element
                ui.helper.css("cursor", "no-drop");
                // Some code on drop out here...
            }
            else {
               // Some code on drop out of old element

               // Perhaps some code on 'over' that has to be done after
               // drop out of old element
            }

        },
        drop: function (event, ui) {
            // handle drop event
        }
    });

但是：我可以相信下一个元素上的over 在旧元素上的out 之前触发吗？

【讨论】：