Javascript 如何在空动态树上删除节点

我在同一页上有两棵树。树1具有不同数量的节点，树2为空。我想从树1中拖动一个节点，然后将其放到树2上。当树2不是空的时候，一切正常。但是，如果树2为空，则它根本不工作。这是我的密码：

$('#tree1').dynatree({
    dnd: {
        onDragStart: function (node) {
            return true;
        }
    }
});

$('#tree2').dynatree({
    dnd: {
        onDragEnter: function (node, sourceNode) {
            return true;
        },
        onDrop: function (node, sourceNode, hitMode, ui, draggable) {
            var copyNode = sourceNode.toDict(true, function (dict) {
                delete dict.key;
            });
            node.addChild(copyNode);
        }
    }
});

---

有人能告诉我如何解决这个问题吗？Thanx。阅读dynatree源代码（版本1.2.0）后，我发现如果不修改源代码，就不可能将节点添加到空树中。这是因为当您尝试将源节点放到目标树中时，实际上是将源节点放到目标节点中/之前/之后，而不是目标树中。因此，如果树中没有节点，dynatree将无法工作。

我做了如下操作：

var tree1Dragging = false,
    tree2Over = false;

$('#tree1').dynatree({
    dnd : {
        onDragStart : function(node) {
            tree1Dragging = true;
            return true;
        },
        onDragStop : function(node) {
            critDrag = false;

            if (tree2Over) {
                //TODO do your drop to tree2 process here (get the root and append the "node" to it for example)
            }
        }
    }
});

$('#tree2').dynatree({
    dnd : {
        onDragEnter : function(node, sourceNode) {
            return true;
        },
        onDrop : function(node, sourceNode, hitMode, ui, draggable) {
            var copyNode = sourceNode.toDict(true, function(dict) {
                delete dict.key;
            });
            node.addChild(copyNode);
        }
    }
});

// Add mouse events to know when we are above the tree2 div
$("#tree2").mouseenter(function() {
    if (tree1Dragging) {
        tree2Over = true;
    }
}).mouseleave(function(){
    tree2Over = false;
});

---

控制台说什么了吗？您的

tree2

元素是否具有指定的高度和宽度？（>当它为空时，你真的能看到它吗？）我简化了你的解决方案。在触发onDragStart事件时，我假定标志DragOver=false；。如果onDrop被触发，则设置DragOver=true；。在onDragStop上，我检查了（DragOver）{//drop On node}是否{//drop On empty}。这对我有用。