jsTree 确定树之间的移动并更改复制的节点 ID

jsTree determine move between trees and change copied node ID

我正在尝试使用 jsTree 根据父子关系创建 2 棵树。为此,我使用以下脚本:

$(function () {

   loadTree($('#jstree_indexed_container'), document.getElementById('hiddenFieldIndexedData').value);
   loadTree($('#jstree_nonindexed_container'), document.getElementById('hiddenFieldNonIndexedData').value);

});

function loadTree(jsTreeContainer, stringData) {

   jsTreeContainer.jstree({

      "core": {
         "animation": 0,
         "check_callback": true,
         "themes": { "stripes": true },
         'data': JSON.parse(stringData)
      },
      "plugins": ["contextmenu", "dnd", "search", "wholerow", "unique"]

   });

   jsTreeContainer.on("move_node.jstree", function (e, data) {
      notifyServerOfChange(data, false);
   });

   jsTreeContainer.on("copy_node.jstree", function (e, data) {
      notifyServerOfChange(data, true);
   });

}

function notifyServerOfChange(data, isCopy) {
   var oldParent = getNodeById(data.old_instance, data.old_parent);
   var newParent = getNodeById(data.new_instance, data.parent);

   alert(sprintf("%s node %s from %s to %s. It now has ID: %s", (isCopy ? "Copied" : "Moved"), (data.original != null ? data.original.id : data.node.id), getNodeTitle(oldParent), getNodeTitle(newParent), data.node.id));
}

function getNodeById(jsTreeContainer, id) {
   return jsTreeContainer.element.find("[id='" + id + "']");
}

function getNodeTitle(node) {
   return node.find('a').first().text();
}

但是,在两棵树之间移动节点时,总是会调用 "copy_node.jstree" 事件,即使我正在移动节点。如果我在同一棵树中移动节点,我会得到正确的 "move_node.jstree" 事件。

问题 1:有没有办法正确确定节点是否在两棵树之间移动,而不是复制?

问题2:我的节点ID是根据父子关系计算的,所以在复制/移动节点后,我重新计算这个关系,我想用它来替换节点的先前ID。如果我尝试修改notifyServerOfChange方法中的data.node.id,之后就不能再选择节点了

谢谢

如果您通过拖放在树之间移动节点(因为它来自您使用的插件),您可以收听 dnd_stop.vakata 事件并检查 ctrl 键是否按下,如下所示:

$(document).on('dnd_stop.vakata', function (e, data) {
    if (data.event.ctrlKey) {
        console.log('copy');
    } else {
        console.log('move');
    }
 });

检查fiddle:JS Fiddle