问题描述:
在做一个类似目录树的东西,其中有一些元素。可以理解成文件和文件夹。类似下图:
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事件的官方文档:
Name | Parameters | Description |
---|---|---|
onBeforeDrop | target,source,point | Fires 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方法的官方文档:
Name | Parameter | Description |
---|---|---|
getData | target | get the specified node data, including its children. |