ztree 懒加载




















var  rMenu = $("#rMenu");
var tree = { 
     zTree:'', 
     pNode:'', 
     setting:{ 
         isSimpleData: true, 
         treeNodeKey: "id", 
         treeNodeParentKey: "pid", 
         showLine: true, 
         root:{  
             isRoot:true, 
             nodes:[] 
         }, 
         callback:{ //回调函数 
             /** 
              * event:鼠标事件 
              * treeId:树的容器id 
              * treeNode:当前点击的节点 
              */
              onRightClick: OnRightClick,
              onExpand:function(event,treeId,treeNode){ 
                 tree.pNode = treeNode; 
                 tree.loadNodeByPNode(); 
             } 
         } 
     }, 
 /** 
      * 一般情况下,如果一段代码中要用到一个变量 
      * 而这个变量的值是在回调函数中赋值的 
      * 这个时候要保证使用这个变量的时候回调函数已经执行了 
      */ 
     loadRootNode:function(){ //加载根节点,pid=0 
      var zNodes=[];
         var parameter = { 
                 pid:0 
         }; 
         $.post('<%=dataUrl0%>',parameter,function(data){ 
          $.each(data, function(i,item){  
           var html={id:item.key,pid:i, name:item.title, open:false, noR:false,isParent:true,parent: true,};
              // html.children= ajaxChild(item.key);
                 zNodes[i]=html;
             });  
         }); 
         $.fn.zTree.init($("#treeDemo"), tree.setting,zNodes);
         tree.zTree = $.fn.zTree.getZTreeObj("treeDemo");
     }, 


 //点击该节点,加载该节点的子节点
 
 /** 
      * 该方法是点击父节点的+号后执行的,意味着执行该方法的时候树已经生成了 
      * 所以才能用tree.zTree 
      */ 
     loadNodeByPNode:function(){
         var children=[];
         var folder=false;
         var parameter= { 
           pcode:tree.pNode.id //子节点的pcode是父节点的id 
         }; 
         //获取pid = mid的数据,也就是子节点的id等于父节点的id,说明此父节点加载了子节点 
         if(!tree.zTree.getNodeByParam("pid",tree.pNode.id)){
             $.post('<%=base%>/work/sys/parts/getCategoryId.do',parameter,function(reback){ 
                 /** 
                  * 把查询出来的字节点追加到父节点上 
                  */
                  $.each(reback, function(o,item2){ 
                var html2={id:item2.key,pid:item2.pcode, name:item2.title,isParent:item2.folder};
               
                 folder=item2.folde;
                 children[o]=html2;
                  })
             }); 
             tree.zTree.addNodes(tree.pNode,children,folder);
         } 
     } 
 }; 
$(document).ready(function(){
     tree.loadRootNode();
 }); 


 function OnRightClick(event, treeId, treeNode) {
  
  $('#chiocenodeid').val(treeNode.id);//点击结点给input赋值
        $('#chiocenodename').val(treeNode.name);
      
        //$('#codeid').val(treeNode.name);
  if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
   tree.zTree.cancelSelectedNode();
   showRMenu(treeNode.id,"root", event.clientX, event.clientY);
  } else if (treeNode && !treeNode.noR) {
   tree.zTree.selectNode(treeNode);
   showRMenu(treeNode.id,treeNode.isParent, event.clientX, event.clientY);
  }
 }

 function showRMenu(pcode,type, x, y) {//判断点击的是那个节点
  
   $("#rMenu ul").show();
  
  if (type==true) {//父节点
   $("#m_add").show();
      $("#m_add").attr("pcode",pcode)
   $("#m_edit").show();
   $("#m_del").show();
   
  } else if(type==false){
   $("#m_add").hide();
   $("#m_edit").show();
   $("#m_del").show();
   
  }else{
   $("#m_add").hide();
   $("#m_edit").hide();
   $("#m_del").hide();
  }
  y+= $(document).scrollTop();
  rMenu.css({"top":y+"px", "left":x+"px", "visibility":"visible"});

  $("body").bind("mousedown", onBodyMouseDown);
 }
 
 function hideRMenu() {
  
  if (rMenu) rMenu.css({"visibility": "hidden"});
  $("body").unbind("mousedown", onBodyMouseDown);
 }
 function onBodyMouseDown(event){
  
  if (!(event.target.id == "rMenu" || $(event.target).parents("#rMenu").length>0)) {
   rMenu.css({"visibility" : "hidden"});
  }
 }
 

你可能感兴趣的:(各种插件)