treeview.js

DWR与界面开发 ,对ajax感兴趣的可以看看哦

function BSTreeView(name,fomename,showType,style,father){
  this.name = name||"BSTreeView";
  this.fomename=fomename||"frmBusiness";
  this.showType = showType||false;
  this.style = style||"";
  this.nodeList = new Array();
  this.rootList = new Array();
  this.thisDeepNo = 0;
  this.htmlStr = "";
  this.clickID = -1;
  this.isFinish = true;
  this.rmObj = null;
  this.imagePath = "/"+getDomain()+"/common/images/";//缺省的路径
  this.showLine = true;//是否显示连线
  this.showAddImg = true;//是否显示+-
  this.showNodeImg = true;//是否现实图片
  this.father = father||"";
  this.freshJsfun = "";
  this.thisOppNode = null;//记录当前即点即查的节点
  this.isBinaryStar = false;
  //添加右键
  try{
    this.rmObj = eval(this.name + "_rm");//右键菜单
  }
  catch(e){
    this.rmObj = null;
  }

  /*****get/set方法开始*****/
  //设置刷新状态时的方法(限于BinaryStar框架使用)
  this.setFreshJsfun = function(inFreshJsfun){
    this.freshJsfun = inFreshJsfun;
  }

  //设置图片的路径
  this.setImagesPath = function(inPath){
    this.imagePath = inPath;
  }

  //是否显示线
  this.setShowLine = function(showFlg){
    this.showLine = showFlg;
  }

  //是否显示节点图片
  this.setShowNodeImg = function(showNodeImgFlg){
    this.showNodeImg = showNodeImgFlg;
  }

  //是否显示+-图片
  this.setShowAddImg = function(showAddImgFlg){
    this.showAddImg = showAddImgFlg;
  }

  //设置右键菜单
  this.setRigthMenu = function (inRmObj){
    this.rmObj = rmOBJ;
  }

  //得到树的深度
  this.getDeep = function (){
  	return this.thisDeepNo;
	}
  /*****get/set方法结束*****/

  /*****节点操作方法开始*****/
  //添加跟节点
  this.addRootNode = function (name, showStr, jsfun, openjs, paras, isOpen, isDoOpen, rmAreaIndex, openImg, closeImg, nodeImg){
    return this.addNode(-1, 0, name, showStr, jsfun, openjs, paras, isOpen, isDoOpen, rmAreaIndex, openImg, closeImg, nodeImg);
  }

  //添加节点
  this.addNode = function(pid, deepID, name, showStr, jsfun, openjs, paras, isOpen, isDoOpen, rmAreaIndex, openImg, closeImg, nodeImg){
    var inNode = new BSNode(this.nodeList.length, pid, deepID, this.name, name, showStr, jsfun, openjs, paras, isOpen, isDoOpen, rmAreaIndex);
    //设置图片
    if (openImg != null && openImg.Trim() != ""){
      inNode.openImg = openImg;
    }
    if (closeImg != null && closeImg.Trim() != ""){
      inNode.closeImg = closeImg;
    }
    if (nodeImg != null && nodeImg.Trim() != ""){
      inNode.nodeImg = nodeImg;
    }
    if (pid >= 0){
      this.nodeList[pid].addChildItem(this.nodeList.length);
    }
    else{
      this.rootList.length++;
      this.rootList[this.rootList.length-1] = this.nodeList.length;
    }
    this.nodeList.length++;
    this.nodeList[this.nodeList.length-1] = inNode;

    if (deepID > this.thisDeepNo){
      this.thisDeepNo = deepID;
    }
    if (document.getElementById(this.name+"_main") != null){
      //树已生成时动态添加
      this.showAddNode(inNode.id);
    }
    return inNode;
  }

  //添加单个节点对象(用于调度)
  this.addOneNode = function (pid, inNode){
    if (inNode == null){
      alert("没有可添加的节点");
      return;
    }
    if (pid >= 0){
      this.nodeList[pid].addChildItem(inNode.id);
    }
    else{
      this.rootList.length++;
      this.rootList[this.rootList.length-1] = inNode.id;
    }
    inNode.pid = pid;
    //重设深度
    inNode.deepID = this.nodeList[pid].deepID+1;
    if (inNode.deepID > this.thisDeepNo){
      this.thisDeepNo = inNode.deepID;
    }
    if (document.getElementById(this.name+"_main") != null){
      //树已生成
      this.showAddNode(inNode.id);
    }
    return inNode;
  }

  //更新节点
  this.updateNode = function (id, inNode){
    if (inNode == null){
      alert("没有可更改的节点");
      return;
    }
    var thisNode = this.nodeList[id];
    inNode.pid = thisNode.pid;
    //重设深度
 	  inNode.id = thisNode.id;
    inNode.deepID = thisNode.pid.deepID;
    this.nodeList[id] = inNode;
    if (document.getElementById(this.name+"_main") != null){
      //树已生成
	  var thisdiv = document.getElementById(this.name+"_"+inNode.id+"_node");
	  //重画父节点
	  var strTemp = "";
	  strTemp += "<nobr>";
	  strTemp += this.DrawLink(inNode.id);
	  strTemp += this.DrawShowStr(inNode.id);
	  strTemp += "</nobr>";
	  thisdiv.innerHTML = strTemp;
    }
    return inNode;
  }

  //打开父亲节点
  this.openParent = function(id){
    if (id >= 0){
      var node = this.nodeList[id];
      var div = document.getElementById(this.name+"_"+id+"_div");
      var thisdiv = document.getElementById(this.name+"_"+node.id+"_node");
      div.style.display = "block";
      node.isOpen = true;
      node.isDoOpen = true;
      //重画父节点
      var strTemp = "";
      strTemp += "<nobr>";
      strTemp += this.DrawLink(node.id);
      strTemp += this.DrawShowStr(node.id);
      strTemp += "</nobr>";
      thisdiv.innerHTML = strTemp;
      this.openParent(node.pid);
    }
  }

  //动态添加节点
  this.showAddNode = function(id){
    var node = this.nodeList[id];
    //得到父节点对象
    this.openParent(node.pid);
    var p_node = this.nodeList[node.pid];
    //得到父节点的元素
    var div = document.getElementById(this.name+"_"+p_node.id+"_div");

    //重画兄弟和本身
    strTemp = "";
    if (p_node.childList.length > 0){
      var prevNode = node.prev();
      if (prevNode != null){
        div.removeChild(document.getElementById(this.name+"_"+prevNode.id+"_node"));
        div.removeChild(document.getElementById(this.name+"_"+prevNode.id+"_div"));
        strTemp += this.DrawNode(prevNode.getId());
      }
      strTemp += this.DrawNode(id);
      div.innerHTML = (div.innerHTML+strTemp);

    }
    if (this.isBinaryStar){
      this.optionFrame(true);
    }
  }

  //节点打开操作
  this.doOpen = function(id){
    if (!this.isFinish){
      alert("上一动作尚未完成，或出现错误！");
      return;
    }
    this.isFinish = false;
    var node = this.nodeList[id];
    var div = document.getElementById(this.name+"_"+id+"_div");
    var str = document.getElementById(this.name+"_"+id);
    var imgo = document.getElementById(this.name+"_"+id+"_o");
    var imgf = document.getElementById(this.name+"_"+id+"_f");
    try{
      var thisForm = eval(this.fomename);
    }
    catch(e){
      var thisForm = null;
    }
    if (this.isBinaryStar){
      this.optionFrame(true);
      thisForm.target = "BSTree_frame";
    }

    if (node.isOpen){
      div.style.display = "none";
      if (imgo!=null){
        imgo.src = imgo.src.replace("minus.gif", "plus.gif");
    	}
      if (imgf!=null){
	      imgf.src = imgf.src.replace(node.openImg, node.closeImg);
    	}
      node.isOpen = false;
      this.setTreeNodeID(id);
      if (this.getChgFlg(id)){
        str.focus();
        this.changeClickID(id);
      }
      if (this.showType && node.isDoOpen){
        this.setTreeNodeID(id);
        if (this.isBinaryStar && this.freshJsfun != null && this.freshJsfun.Trim() != ""){
          try{
            eval(this.freshJsfun);
          }
          catch(e){
            alert("*^_^*恭喜你中招了!\n\r "+e.name+":"+e.message+" \n\r刷新节点状态的方法\n\r"+this.freshJsfun+"\n\r发生严重错误！");
          }
        }
      }
      this.isFinish = true;
    }
    else{
      if (node.childList.length > 0){
        div.style.display = "block";
				node.isOpen = true;
      }
      if (imgf!=null){
	      imgf.src = imgf.src.replace(node.closeImg, node.openImg);
    	}
      if (imgo!=null){
        imgo.src = imgo.src.replace("plus.gif", "minus.gif");
    	}
      this.setTreeNodeID(id);
      //判断是否是即点即查
      if (this.showType && !node.isDoOpen && node.childList.length==0){
        node.isDoOpen = true;
        if (node.openjs != ""){
          //弹出提示框
          showBSMinDialogBox("Loadiong……", "");
          try{
            eval(node.openjs);
          }
          catch(e){
            alert("*^_^*恭喜你中招了!\n\r "+e.name+":"+e.message+" \n\r打开节点的方法\n\r"+node.openjs+"\n\r发生严重错误！");
            this.isFinish = true;
          }
        }
        else if(node.childList.length == 0){
          if (this.isBinaryStar && this.freshJsfun != null && this.freshJsfun.Trim() != ""){
            try{
              eval(this.freshJsfun);
            }
            catch(e){
              alert("*^_^*恭喜你中招了!\n\r "+e.name+":"+e.message+" \n\r刷新节点状态的方法 "+this.freshJsfun+" \n\r发生严重错误！");
              this.isFinish = true;
            }
          }
          this.isFinish = true;
        }
      }
      else if (this.showType && node.isDoOpen){
        if (this.isBinaryStar && this.freshJsfun != null && this.freshJsfun.Trim() != ""){
          try{
            eval(this.freshJsfun);
          }
          catch(e){
            alert("*^_^*恭喜你中招了!\n\r "+e.name+":"+e.message+" \n\r刷新节点状态的方法 "+this.freshJsfun+" \n\r发生严重错误！");
            this.isFinish = true;
          }
        }
        this.isFinish = true;
      }
      else{
        this.isFinish = true;
      }
      //调整父元素的滚动条
      var mainDiv = document.getElementById(this.name+"_main");
      var pNode = mainDiv.parentNode;
      if (pNode != null){
      	var curH = div.offsetTop - pNode.scrollTop;//该节点在相对高度
      	var difH = pNode.offsetHeight-curH-(str.offsetHeight);
      	var addH = 0;
		if ((curH + div.offsetHeight) > pNode.offsetHeight){
			addH = div.offsetHeight-difH;
		}
		if ((curH-addH) < 0){
			addH = curH-(str.offsetHeight+2);
		}
		pNode.scrollTop = pNode.scrollTop+addH;
      }
    }
  }

  //删除节点
  this.removeNode = function(inId){
    if (inId >= 0 && inId < this.nodeList.length){
      this.changeClickID("-1");
      this.setTreeNodeID("-1");
      var thisNode = this.nodeList[inId];
      if (document.getElementById(this.name+"_"+inId+"_node")!= null){
        var pnodeElm = document.getElementById(this.name+"_"+inId+"_node").parentNode;
        pnodeElm.removeChild(document.getElementById(this.name+"_"+inId+"_node"));
        pnodeElm.removeChild(document.getElementById(this.name+"_"+inId+"_div"));
      }

      //父亲节点的重画
      var prevNode = thisNode.prev();
      var nextNode = thisNode.next()
      thisNode.deleteOneChildNode();
      var p_node = this.nodeList[thisNode.pid];
      var div = document.getElementById(this.name+"_"+p_node.id+"_div");
      var thisdiv = document.getElementById(this.name+"_"+p_node.id+"_node");
      var strTemp = "";
      strTemp += "<nobr>";
      strTemp += this.DrawLink(p_node.id);
      strTemp += this.DrawShowStr(p_node.id);
      strTemp += "</nobr>";
      thisdiv.innerHTML = strTemp;

      //重画兄弟和本身
      strTemp = "";
      div.style.display = "none";
      if (p_node.childList.length > 0){
        div.style.display = "block";
        if (prevNode != null){
          strTemp = "";
          var prevDiv = document.getElementById(this.name+"_"+prevNode.id+"_node");
          strTemp += "<nobr>";
          strTemp += this.DrawLink(prevNode.id);
          strTemp += this.DrawShowStr(prevNode.id);
          strTemp += "</nobr>";
          prevDiv.innerHTML = strTemp;
        }
        if (nextNode != null){
          strTemp = "";
          var nextDiv = document.getElementById(this.name+"_"+nextNode.id+"_node");
          strTemp += "<nobr>";
          strTemp += this.DrawLink(nextNode.id);
          strTemp += this.DrawShowStr(nextNode.id);
          strTemp += "</nobr>";
          nextDiv.innerHTML = strTemp;
        }
      }
    }
  }

  //删除根节点
  this.removeRoot = function(){
    if (document.getElementById(this.name+"_main")!= null){
      var pnodeElm = document.getElementById(this.name+"_main").parentNode;
      pnodeElm.removeChild(document.getElementById(this.name+"_main"));
      this.nodeList = new Array();
      this.rootList = new Array()
      this.thisDeepNo = 0;
      this.htmlStr = "";
      this.clickID = -1;
      this.isFinish = true;
      this.rmObj = null;
    }
  }
  /*****节点操作方法结束*****/

  /*****树的绘制方法开始*****/
  //画树
  this.DrawTree = function(in_showType){
    var type = in_showType || false;
    this.htmlStr = "<div id=\""+this.name+"_main\">";
    this.htmlStr += this.initTree();
    for (var i=0; i<this.rootList.length; i++){
      if (!this.rootList[i].isDelete){
        this.htmlStr += this.DrawNode(this.rootList[i]);
      }
    }
    //alert(this.htmlStr);
    this.htmlStr += "</div>";
    if (type){
      if (this.father != "" && document.getElementById(this.father)!=null){
      	var fatObj = document.getElementById(this.father);
       	fatObj.innerHTML = this.htmlStr;
      }
      else{
 	     document.writeln(this.htmlStr);
      }
      this.setTreeNodeID("-1");
    }
    return this.htmlStr;
  }

  //画节点
  this.DrawNode = function(id){
    var strTemp = "";
    var node = this.nodeList[id];