Jquery 可拖拽的Ztree

比較懶，就只貼關鍵代碼吧，本身把有用的屬性所有打印出來了，也加了很多註釋。

保存後涉及到的排序問題，刷新問題還未考慮到，後面有的話再加。

  1         $.fn.zTree.init($("#ztree"), {
  2             data: {
  3                 simpleData: {
  4                     enable: true
  5                 }
  6             },
  7             view:{
  8                 selectedMulti :false
  9             },
 10             edit: { //此屬性添加後，樹才能夠被拖拽
 11                 enable: true,
 12                 showRemoveBtn: false,
 13                 showRenameBtn: false,
 14                 drag: {
 15                     isCopy: true,
 16                     isMove: true,
 17                     prev: true,
 18                     next: true,
 19                     inner: true
 20                 }
 21             },
 22             callback: {
 23                 onClick: function(event, treeId, treeNode, clickFlag) {
 24                     switch (treeNode.gradeType) {
 25                         case "db":
 26                             clickCatgryNode(treeNode.id);
 27                             break;
 28                         case "c":
 29                             clickCatgryNode(treeNode.id);
 30                             break;
 31                         case "t":
 32                             clickTabNode(treeNode.id,false);
 33                             break;
 34         
 35                         default:
 36                             break;
 37                     }
 38                 },
 39                 beforeDrag: function(treeId, treeNodes){
 40                     console.log("開啓拖拽");
 41                     return true;
 42                 },
 43                 beforeDrop: function(treeId, treeNodes, targetNode, moveType, isCopy){
 44                     console.log("能夠拖拽");
 45                     //console.log(treeId);
 46                     //console.log(treeNodes);
 47                     console.log(treeNodes);
 48                     //console.log(targetNode);
 49                     console.log("【源節點】節點id:"+treeNodes[0].id+"  父節點id:"+treeNodes[0].pId+"  級層："+treeNodes[0].level+"  名稱："+treeNodes[0].name);
 50                     //若是拖拽的是目錄
 51                     if(treeNodes[0].isParent){
 52                         $.each(treeNodes[0].children,function(i,treeNode){
 53                             console.log("【源節點】子節點"+i+":"+treeNode.id+"  父節點id:"+treeNode.pId+"  級層："+treeNode.level+"  名稱："+treeNode.name);
 54                         });
 55                     }
 56                     console.log("【目標節點】 節點id:"+targetNode.id+"  父節點id:"+targetNode.pId+"  級層："+targetNode.level+"  名稱："+targetNode.name);
 57                     //console.log("treeId:"+treeId+"--treeNodes:"+treeNodes+"--targetNode:"+targetNode+"--moveType:"+moveType+"--isCopy:"+isCopy);
 58                     //庫名不容許拖拽
 59                     if(treeNodes[0].level==0){
 60                         alert("不容許拖拽庫節點");
 61                         return false;
 62                     }
 63                     //不容許拖拽到表節點下(若是樹狀圖中有空目錄，那仍是須要在後臺進行校驗該節點是不是表節點）
 64                     if(!targetNode.isParent){
 65                         alert("不容許拖拽任何節點到表節點下");
 66                         return false;
 67                     }
 68                     
 69                     return true;
 70                 },
 71                 beforeDragOpen: function(){ 
 72                     console.log("自動展開目錄");
 73                     return true; 
 74                 },
 75                 onDrag: function(){
 76                     console.log("拖拽中");
 77                     return true;
 78                 },
 79                 onDrop: function(event, treeId, treeNodes, targetNode, moveType, isCopy){
 80                     console.log("拖拽完畢");
 81                     //console.log(treeId);
 82                     //console.log(treeNodes);
 83                     //console.log(targetNode);
 84                     console.log("【源節點】節點id:"+treeNodes[0].id+"  父節點id:"+treeNodes[0].pId+"  級層："+treeNodes[0].level+"  名稱："+treeNodes[0].name);
 85                     //若是拖拽的是目錄
 86                     if(treeNodes[0].isParent){
 87                         $.each(treeNodes[0].children,function(i,treeNode){
 88                             console.log("【源節點】子節點"+i+":"+treeNode.id+"  父節點id:"+treeNode.pId+"  級層："+treeNode.level+"  名稱："+treeNode.name);
 89                         });
 90                     }
 91                     console.log("【目標節點】 節點id:"+targetNode.id+"  父節點id:"+targetNode.pId+"  級層："+targetNode.level+"  名稱："+targetNode.name);
 92                     //console.log("event:"+event+"--treeId:"+treeId+"--treeNodes:"+treeNodes+"--targetNode:"+targetNode+"--moveType:"+moveType+"--isCopy:"+isCopy);
 93                     return true;
 94                 },
 95                 onExpand: function(){
 96                     console.log("得到被展開的節點信息");
 97                     return true;
 98                 }
 99             }
100         }, zNodes);