【解决方法】让easyui中的tree控件中的node不可随意拖放（取消部分node拖放效果）

问题描述：

在做一个类似目录树的东西，其中有一些元素。可以理解成文件和文件夹。类似下图：

easyui让tree控件很好的实现了拖拽功能，但是拖拽功能太随意了，任何东西都可以拖动。也就是说，【File】里也可以继续添加file，而这时不符合我的需求的。

所以，简单总结一下需求：

实现有些node是不能添加子node。

解决方法：

监听控件的onBeforeDrop方法，判断，当目标节点是文件的时候，返回false。

事例代码：

 JavaScript Code 

1
2
3
4
5
6
7
8
9
10
11
12
13
14

$('#file-tree').tree({
    onBeforeDrop : function (target, source, point)
    {
        if (point === 'append')
        {
            var targetNode = $(this).tree('getNode', target);
            if (targetNode.type === 'file')
            {
                return false;
            }
        }
    }
});

事例讲解：

• node中要添加一个type属性，用来区分是file还是folder。当然，这个属性可以随意指定，只要能区分开就行。
• onBeforeDrop事件的官方文档：

NameParametersDescriptiononBeforeDroptarget,source,pointFires before a node is dropped, return false to deny drop.
target: DOM object, The node being targeted for the drop.
source: the source node.
point: indicate the drop operation, posible values are: 'append','top' or 'bottom'.
This event is available since version 1.3.3.

• getNode方法的官方文档：

NameParameterDescriptiongetDatatargetget the specified node data, including its children.