treeview.js

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

    var display = "none";
    if (node.isOpen){
      display = "block";
    }
    //Draw this node
    strTemp += "<div class=\"tree_node\" id=\""+(this.name+"_"+id+"_node")+"\"><nobr>";
    strTemp += this.DrawLink(id);
    strTemp += this.DrawShowStr(id);
    strTemp += "</nobr></div>";
    //Draw children
    strTemp += "<div id=\""+(this.name+"_"+id+"_div")+"\" style=\"display:"+display+"\">";
    if (node.childList.length > 0){
      for (var i=0; i<node.childList.length; i++){
        if (!node.childList[i].isDelete){
          strTemp += this.DrawNode(node.childList[i]);
        }
      }
    }
    strTemp += "</div>";
    return strTemp;
  }

  //画线
  this.DrawLink = function(id){
    var strTemp = "";
    var node = this.nodeList[id];
    var oi = "Lplus.gif";
    var of = "close.gif";
    var mclick = "";

    if (!this.showAddImg){
    	this.showLine = false;
    }
    //递归画上一层的图片
    if (node.pid >= 0){
      strTemp += this.DrawPLink(node.pid);
    }

    //设置有孩子节点的图片设置;
    if (node.childList.length > 0 || (this.showType && node.isDoOpen==false && node.openjs!="")){
      if (node.isOpen){
        of = "open.gif";
        oi = "minus.gif";
        if (node.openImg != null && node.openImg != ""){
          of = node.openImg;
        }
      }
      else{
        of = "close.gif";
        oi = "plus.gif";
        if (node.closeImg != null && node.closeImg != ""){
          of = node.closeImg;
        }
      }
      if (node.pid < 0){//root
        if (this.rootList[this.rootList.length-1] != id){
          oi = ("T"+oi);
        }
        else{
          oi = ("L"+oi);
        }
      }
      else{
        if (this.nodeList[node.pid].childList[this.nodeList[node.pid].childList.length-1] != id){
          oi = ("T"+oi);
        }
        else{
          oi = ("L"+oi);
        }
      }
    }
    else{
    	//设置无孩子节点的图片
      if (node.pid >= 0){
        if (this.showLine){
          if (this.nodeList[node.pid].childList[this.nodeList[node.pid].childList.length-1] != id){
            oi = "T.gif";
          }
          else{
            oi = "L.gif";
          }
        }
	    	else{
					oi = "empty.gif";
		    }
      }
      else {
      	if (this.showLine){
	        if (this.rootList[this.rootList.length-1] == id){
	        	oi = "L.gif";
	        }
	        else if (this.rootList[0] == id){
	        	oi = "P.gif";
	        }
	        else{
	        	oi = "T.gif";
	        }
	      }
	    	else{
					oi = "empty.gif";
		    }
      }
      of = "jsdoc.gif";
      if (node.nodeImg != null && node.nodeImg != ""){
        of = node.nodeImg;
      }
    }
    //画+-图片
    if (this.showAddImg){
      strTemp += "<img class=\"node_img\" style=\"cursor:hand;\" onclick=\""+this.name+".doOpen("+id+")\" id=\""+this.name+"_"+id+"_o\" align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+oi+"\" border=\"0\"/>";
    }
    //画节点图片
    if (this.showNodeImg){
	    strTemp += "<img align=\"absmiddle\" style=\"cursor:hand;\" id=\""+this.name+"_"+id+"_f\" alt=\"\" onclick=\""+this.name+".doOpen("+id+")\" src=\""+this.imagePath+of+"\" border=\"0\"/>";
    }
    return strTemp;
  }

  //画父节点的线
  this.DrawPLink = function(id){
    var strTemp = "";
    var node = this.nodeList[id];
    //Draw pid
    if (node.pid >= 0){
      strTemp += this.DrawPLink(node.pid);
    }
    if (!this.showLine){
      strTemp += "<img align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+"empty.gif\" border=\"0\"/>";
    }
    else{
      if (node.pid < 0){
        if (this.rootList[this.rootList.length-1] != id){
          strTemp += "<img align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+"I.gif\" border=\"0\"/>";
        }
        else{
          strTemp += "<img align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+"empty.gif\" border=\"0\"/>";
        }
      }
      else{
        if (this.nodeList[node.pid].childList[this.nodeList[node.pid].childList.length-1] != id){
          strTemp += "<img align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+"I.gif\" border=\"0\"/>";
        }
        else{
          strTemp += "<img align=\"absmiddle\" alt=\"\" src=\""+this.imagePath+"empty.gif\" bswebrder=\"0\"/>";
        }
      }
    }
    return strTemp;
  }

  //输出文字
  this.DrawShowStr = function(id){
    var node = this.nodeList[id];
    var tclass = "tree_a";
    if (node.id == this.clickID){
    	tclass = "tree_node_onfocus";
    }
    var strTemp = "&nbsp;<a title=\""+node.getTitle()+"\" id=\""+(this.name+"_"+id)+"\"  href=\"#\" class=\""+tclass+"\" onfocus=\"this.blur();\" ";
    strTemp += "onmousedown=\""+this.name+".doJSFun("+id+")\" ";
    strTemp += "onclick=\"window.event.returnValue=false;\" ";
    if (this.rmObj != null){
      strTemp += "onmouseup=\""+this.name+".showRM("+id+")\"";
    }
    strTemp += ">"+node.showStr+"</a>";
    return strTemp;
  }
  /*****树的绘制方法结束*****/

  /*****设置树节点状态方法开始*****/
  //设置当前激活的节点
  this.changeClickID = function(id){
    if (!(this.clickID < 0 || this.clickID == id)){
      var str = document.getElementById(this.name+"_"+this.clickID);
        str.className = "tree_node_onblur";
    }
    if (id >= 0 && id < this.nodeList.length){
      var str = document.getElementById(this.name+"_"+id);
      str.className = "tree_node_onfocus";
    }
    this.clickID = id;
  }

  //节点收起时，判断是否存在激活状态的孩子节点
  this.getChgFlg = function(id){
    var node = this.nodeList[id];
    for (var i=0; i<node.childList.length; i++){
      var cnode_id = node.childList[i];
      if (this.getChgFlg(cnode_id)){
        return true;
      }
      else if (this.clickID == cnode_id){
        return true;
      }
    }
    return false;
  }
  /*****设置树节点状态方法结束*****/

  /*****树的附加动作开始*****/
  //执行点击节点的JS方法。
  this.doJSFun = function(id){
    window.event.cancelBubble=true;
    this.changeClickID(id);
    this.setTreeNodeID(id);
    if(window.event.button == 1){
      var node = this.nodeList[id];
      if (node.jsfun != ""){
        try{
          eval(node.jsfun);
        }
        catch(e){
          alert("*^_^*恭喜你中招了!\n\r "+e.name+":"+e.message+" \n\r点击节点的方法: "+node.jsfun+" \n\r发生严重错误！");
         	this.isFinish = true;
        }
      }
    }
  }

  //初始化树
  this.initTree = function(){
    var strTemp = "";
    if (document.getElementById(this.name+"_thisTreeNodeID") == null){
      strTemp += "<input type=\"hidden\" id=\""+this.name+"_thisTreeNodeID\" name=\""+this.name+"_thisTreeNodeID\" value=\"\">";
      strTemp += "<input type=\"hidden\" name=\"thisTreeName\" value=\"\">";
    }
    return strTemp;
  }

  //展现右键
  this.showRM = function (id){
    if(window.event.button == 2) {
      var node = this.nodeList[id];
      if (this.rmObj!=null && this.rmObj.itemAreaList.length > node.rmAreaIndex){
        this.rmObj.doRightMenu(node.rmAreaIndex);
      }
    }
  }

  //创建或删除内部桢(用于BinaryStar的即点即查树)
  this.optionFrame = function (optionType){
    if (!this.showType){
      return true;
    }
    var frame = document.getElementById("BSTree_frame_tab");
    var tree = document.getElementById(this.name+"_main");
    if (tree == null){
      return false;
    }
    if (optionType){
      if (frame == null){
        //创建
        var tree_tab = document.createElement("table");
        tree_tab.id = "BSTree_frame_tab";
        tree_tab.style.cssText = "width:1px;height:1px;";
        var row = tree_tab.insertRow(0);
        var sell = row.insertCell(0);
        sell.style.cssText = "width:1px;height:1px";
        sell.innerHTML = "<iframe name=\"BSTree_frame\" id=\"BSTree_frame\" src=\"\" style=\"margin:0px\" height=\"1px\" width=\"1px\" scrolling=\"no\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\"></iframe>";
        tree.appendChild(tree_tab);
      }
    }
    else {
      if (frame != null){
        //删除
        tree.removeChild(frame);
      }
    }
    return true;
  }

  //设置选中的操作
  this.doTreeNodeRef = function (){
    var node = this.nodeList[this.clickID];
    //刷新
    node.childList = new Array();
    var thisForm = eval(this.fomename);
    if (this.isBinaryStar){
      this.optionFrame(true);
      thisForm.target = "BSTree_frame";
    }
    eval(node.openjs);
  }
  /*****树的附加动作结束*****/

  /*****用户使用JS函数开始*****/
  //设置指定节点的选中状态
  this.setNodeActiveById = function (inId){
    if (inId == null){
      alert("请输入一个数字！");
      return;
    }
    if (inId >= 0 && inId < this.nodeList.length){
      var node = this.nodeList[inId];
      this.openParent(node.pid);
      this.changeClickID(inId);
      this.setTreeNodeID(inId);
      return this.nodeList[inId];
    }
    return null;
  }
  this.setNodeActiveByName = function (inName){
    if (inName == null || inName == ""){
      alert("请输入正确的节点名！");
      return ;
    }
    var node = this.getNodeByName(inName);
    if (node != null){
      this.openParent(node.id);
      this.changeClickID(node.id);
      this.setTreeNodeID(node.id);
    }
    return node;
  }

  //打开/关闭指定节点
  this.expandById = function (inId){
    if (inId == null){
      alert("请输入一个数字！");
      return ;
    }
    if (inId >= 0 && inId < this.nodeList.length){
	    this.openParent(this.nodeList[inId].pid);
      this.doOpen(inId);
      return this.nodeList[inId];
    }
    return null;
  }
  this.expandByName = function (inName){
    if (inName == null || inName == ""){
      alert("请输入正确的节点名！");
      return ;
    }
    var node = this.getNodeByName(inName);
    if (node != null){
      this.expandById(node.id);
    }
    return node;
  }

  //打开指定节点
  this.openById = function (inId){
    if (inId == null){
      alert("请输入一个数字！");
      return ;
    }
    if (inId >= 0 && inId < this.nodeList.length){
    	if (!this.nodeList[inId].openFlag()){
	      this.openParent(this.nodeList[inId].pid);
	      this.doOpen(inId);
    	}
      return this.nodeList[inId];
    }
    return null;
  }
  this.openByName = function (inName){
    if (inName == null || inName == ""){
      alert("请输入正确的节点名！");
      return ;
    }
    var node = this.getNodeByName(inName);
    if (node != null){
	     this.openById(node.id);
    }
    return node;
  }

  //关闭指定节点
  this.closeById = function (inId){
    if (inId == null){
      alert("请输入一个数字！");
      return ;
    }
    if (inId >= 0 && inId < this.nodeList.length){
    	if (this.nodeList[inId].openFlag()){
	      this.doOpen(inId);
    	}
      return this.nodeList[inId];
    }
    return null;
  }
  this.closeByName = function (inName){
    if (inName == null || inName == ""){
      alert("请输入正确的节点名！");
      return ;
    }
    var node = this.getNodeByName(inName);
    if (node != null){
	     this.closeById(node.id);
    }
    return node;
  }

  //设置重复点击判断(用户即点即查)
  this.setFinish = function(flg){
    if (flg == null || flg == "false" || !flg){
      this.isFinish = false;
      if (this.showType){
        this.thisOppNode = this.getSelectNode();
      }
    }
    else{
      this.isFinish = true;
      closeDialog();
      if (this.showType && this.thisOppNode.childList.length <= 0){
        this.thisOppNode.updateNode(this.thisOppNode);
      }
      this.thisOppNode = null;
    }
  }
  this.getFinish = function (){
    return this.isFinish;
  }

  //根据节点显示的内容模糊查询
  this.searcNodesByText = function (inText){
    if (inText == null || inText == ""){
      alert("请输入要匹配的字符串！");
      return ;
    }
    var resNodes = new Array();
    for (var i=0; i<this.nodeList.length; i++){
      if (this.nodeList[i].showStr.Trim().indexOf(inText) >= 0){
        resNodes.length++;
        resNodes[resNodes.length-1] = this.nodeList[i];