Jstree，检查drop是否在节点下方、内部或上方答案

【问题标题】：Jstree, check if drop is bellow, inside or above the nodeJstree，检查drop是否在节点下方、内部或上方
【发布时间】：2020-07-30 15:39:22
【问题描述】：

我已经知道如何从拖动节点和目标节点获取 ID。但是我需要知道该下降是在下面还是在上面的节点内。我该怎么做？

divTree.jstree({
    'core': {
        'check_callback': true,
        'data': data,
        'themes': {
            'icons': hasIcons,
            'dots': hasDots
        }
    },
    'plugins': ['themes', 'ui', 'search', 'contextmenu','dnd'],
    'search': {
        'case_sensitive': false,
        'show_only_matches': true
    },
    'contextmenu': {
        'items': contextMenu != null ? contextMenu : ''
    }
})

这是我的 JStree

$(document).on("dnd_stop.vakata", eventDrop);

这就是我调用 drop 事件的方式

const eventDrop = (data) => {
    let elementID = data.data.nodes[0]
    let targetID = data.event.target.parentNode.id;
}

这就是我获得节点 ID 的地方

我想找到类似的东西：

const eventDrop = (data) => {
let elementID = data.data.nodes[0]
let targetID = data.event.target.parentNode.id;
let elementPosition = data.event.indexPos; (Where it could say if its inside, bellow, our above)}

【问题讨论】：

标签： javascript jstree jstree-dnd

【解决方案1】：

好吧，在我深入了解 Jstree 代码之后，我想我找到了答案。所以基本上我所做的是每次鼠标在树内移动时，检查鼠标朝向悬停（或最近）元素的位置是否在波纹管、上方或内部。

我将我的活动更改为：

 const evt_adminmodules_areaTree_OnDrop = (e, data) => {
    if (data.event.type == 'mouseup') {
        let elementID = data.data.nodes[0]
        let targetID = data.event.target.parentNode.id;
    }
    else if (data.event.type == 'mousemove') {
        let ref = $(data.event.target).closest('.jstree-anchor');
        let off = ref.offset();
        if (off) {
            let rel = data.event.pageY - off.top;
            let h = ref.outerHeight();
            if (rel < h / 3) _dropPosition = 'up';
            else if (rel > h - h / 3) _dropPosition = 'bot';
            else _dropPosition = 'mid';
        }
    }
}

至少为此解决了问题：D！谢谢

【讨论】：