jQuery的ztree仿windows文件新建和拖拽功能的实现代码

<!-- 树形菜单 -->
<  rel=\"stylesheet\" href=\"../../common/ztree/css/zTreeStyle/zTreeStyle.css\" rel=\"external nofollow\" >
<  type=\"text/ \" src=\"../../js/jquery-1.9.1.js\" /></ > 
<  src=\"../../common/ztree/js/jquery.ztree.all.min.js\"></ >

 <div class=\"\">
       <div>
        <button id=\"add\">新建组</button>
       </div>
       <div>
        <ul id=\"ztree\" class=\"ztree\"></ul>
       </div>
       <div id=\"addgroup\" style=\"display: none\">
        <input type=\"text\" id=\"group\" name=\"group\">
        <button id=\"submit\">提交</button>
       </div>
    </div>

#add{
 width:80px;
 height:30px;
 background:#2299ee;
 color:#ffffff;
 border:none;
 margin-top:10px;
 margin-bottom:10px;
}
.ztree li span.button.icon01_ico_close {
 margin-right: 2px;
 background: url(../../images/ztree/close.png) no-repeat scroll 0 0 transparent;
 vertical-align: top;
 *vertical-align: middle
}
.ztree li span.button.icon01_ico_open {
 margin-right: 2px;
 background: url(../../images/ztree/open.png) no-repeat scroll 0 0 transparent;
 vertical-align: top;
 *vertical-align: middle
}
.ztree li span.button.icon02_ico_docu {
 margin-right: 2px;
 background: url(../../images/ztree/woman.png) no-repeat scroll 0 0 transparent;
 vertical-align: top;
 *vertical-align: middle
}
.ztree li span.button.icon03_ico_docu {
 margin-right: 2px;
 background: url(../../images/ztree/man.png) no-repeat scroll 0 0 transparent;
 vertical-align: top;
 *vertical-align: middle
}

$(function() {
 var zTreeObj;
 // 初始化ztree
 initTree();
 function initTree() {
  $.get(path() + \"/ztree/init\", function(data) {
   for ( var i in data) {
    if (data[i].token == \"3\")
     data[i].nocheck = true;
   }
   zTreeObj = $.fn.zTree.init($(\"#ztree\"), setting, data);
  });
 }
 // 点击显示div
 $(\"#add\").click(function() {
  $(\"#addgroup\").show();
 })
 // 添加分组
 $(\"#submit\").click(function() {
  $.ajax({
   url : path() + \'/ztree/group/\' + $(\"#group\").val(),
   type : \'post\',
   success : function(data) {
    $(\"#addgroup\").hide();
    // 重新加载
    initTree();
   },
   error : function(data) {
    alert(\"添加分组失败！！\")
   }
  });
 })
 // ztree结构设置
 var setting = {
  check : {
   enable : true,
   chkStyle : \"radio\",
   radioType : \"all\"
  },
  async : {// 异步加载数据操作
   enable : true,
   url : path() + \"/ztree\",
   autoParam : [ \"id\" ],
   type : \"get\",
   // dataFilter : ajaxDataFilter,//用于对 Ajax 返回数据进行预处理的函数
   dataType : \"json\"
  },
  edit : {
   enable : true,
   showRemoveBtn : false,// 设置是否显示删除按钮
   showRenameBtn : setRenameBtn,// 设置是否显示重新命名按钮
   drag : {
    isCopy : false,
    isMove : true,
    prev : true,
    next : true,
    inner : true
   }
  },
  data : {
   keep : {
    parent : true
   // 保持父节点的状态
   },
   simpleData : {
    enable : true,
    idKey : \"id\",
    pIdKey : \"pId\"
   }
  },
  callback : {
   beforeDrag : beforeDrag,
   beforeDrop : zTreeBeforeDrop,
     :  ,
   onRename : zTreeOnRename,
  }
 };
 function setRenameBtn(treeId, treeNode) {
  return treeNode.isParent;
 }
 function zTreeOnRename(event, treeId, treeNode, isCancel) {
  if (treeNode.name == \'\')
   return;
  var params = {
   id : treeNode.id,
   name : treeNode.name,
  }
  $.ajax({
   url : path() + \'/ztree/group\',
   contentType : \'application/json\',
   type : \'post\',
   data : JSON.stringify(params),
   error : function(data) {
    alert(\"操作失败！！\")
   }
  });
 }
 function beforeDrag(treeId, treeNodes) {
  for (var i = 0, l = treeNodes.length; i < l; i++) {
   if (treeNodes[i].token == \"3\") {
    return false;
   }
  }
  return true;
 }
 function zTreeBeforeDrop(treeId, treeNodes, targetNode, moveType) {
  if (targetNode.token != \'3\') {
   return false;
  }
  return true;
 }
 function  (event, treeId, treeNodes, targetNode, moveType, isCopy) {
  if (moveType == null)
   return;
  var params = {
   id : treeNodes[0].id,
   pId : targetNode.id,
   token : moveType,
  }
  // 设置父节点
  $.ajax({
   url : path() + \'/ztree\',
   contentType : \'application/json\',
   type : \'put\',
   data : JSON.stringify(params),
   error : function(data) {
    alert(\"操作失败！！\")
   }
  });
 }
 // 获取项目路径
 function path() {
  var currentPath = window.document.location.href;
  var pathName = window.document.location.pathname;
  var pos = currentPath.indexOf(pathName);
  var localhostPath = currentPath.substring(0, pos);
  var projectName = pathName.substring(0,
    pathName.substr(1).indexOf(\'/\') + 1);
  return (localhostPath + projectName);
 }
})