综合

img BQ

BeQ通用树形控件Ver1.0Beta

发表于2004/10/16 15:47:00  2601人阅读

分类: Javascript

/*
*☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆
*★                                 ★
*☆          BeQ 通用树形控件 Ver 1.0 Beta          ☆
*★                                 ★
*☆ 版权所有: BeQ (BQ)                        ☆
*★                                 ★
*☆ 程序制作: BeQ (BQ)                        ☆
*★   MSN:  bq_x@msn.com                     ★
*☆   email:bq@bqprog.com                      ☆
*★                                 ★
*☆   QQ: 16486280                        ☆
*★                                 ★
*☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆
*/

function addTreeNode(index , nodeText , nodeIcon , selIcon , nodeData , nodeAction)
{
 var st_pNode = this.tree;
 index = parseInt(index);

 if(index>this.nodes.length)index = this.nodes.length;
 
 var cindex = 0;
 for(i=0;(i<this.nodes.length)&&(i<index);i++)
 {
  if(this.nodes[i]=="[tree node]")
  {
   cindex++;
  }
  else if(this.nodes[i]=="[tree branch]")
  {
   cindex+=2;
  }
 }

 var tr = st_pNode.insertRow(cindex);
 var td;
 td = tr.insertCell(0);
 td.innerHTML="<img src=/""+nodeIcon+"/" border=0>";
 td.vAlign="middle";
 td.noWrap = true;
 td.height=22;
 td.width=22;
 td = tr.insertCell(1);
 td.height=22;
 td.vAlign="middle";
 td.noWrap = true;
 td.innerHTML = "<table border=0 cellpadding=0 cellspacing=0><tr><td><img src=/"" + nodeIcon + "/" border=0></td><td nowrap>&nbsp;<label alt='' title='' hidefocus='true' treeType='node' style='cursor:default;'>"+nodeText+"</label></td></tr></table>";
 var iconImg = td.firstChild.rows[0].cells[0].firstChild;
 var textSP = td.firstChild.rows[0].cells[1].firstChild.nextSibling;

 textSP.ondragstart = new Function("this.node.ondargstart();");
 textSP.onmousemove = new Function("window.status='';");

 td.firstChild.rows[0].cells[1].onmouseover = new Function("this.className='"+this.tdMouseOver+"';");
 td.firstChild.rows[0].cells[1].onmouseout = new Function("this.className='"+this.tdMouseOut+"';");
 td.firstChild.rows[0].cells[1].className = this.tdMouseOut;

 textSP.onmouseover = new Function("this.className='"+this.spanMouseOver+"';");
 textSP.onmouseout = new Function("this.className='"+this.spanMouseOut+"';");
 textSP.className = this.spanMouseOut;
 var tn = new treeNode(tr);
 tn.icon = nodeIcon;
 tn.selIcon = selIcon;
 tn.data = nodeData;
 tn.nodeAction = nodeAction;
 tn.parent = this;
 td.firstChild.rows[0].cells[1].node = tn;
 textSP.node = tn;
 tn.text = nodeText;
 tn.textSP = textSP;
 tn.iconImg = iconImg;
 td.firstChild.rows[0].cells[1].onclick = new Function("this.node.onSelected();");
// this.nodes.splice(index , 0 , tn );
 var tmpNodes = new Array;
 for(i=0;i<index;i++)
 {
  tmpNodes[i]=this.nodes[i];
 }
 tmpNodes[tmpNodes.length]=tn;
 for(i=index;i<this.nodes.length;i++)
 {
  tmpNodes[i+1]=this.nodes[i];
 }
 this.nodes=tmpNodes;

 if(this.opened)
 {
  this.TreeRow.style.display="";
 }


 if(index!=0)
 {
  var preSibling = this.nodes[index-1];
  if(preSibling.toString()=="[tree branch]")
  {
   if(preSibling.opened)
   {
    preSibling.img.src="../images/minus.gif"
   }
   else
   {
    preSibling.img.src="../images/plus.gif"
   }
   preSibling.TreeRow.cells[0].style.backgroundImage="url(../images/barI.gif)";
  }
  else
  {
   preSibling.img.src="../images/barH.gif";
  }
 }

 if(index==this.nodes.length-1)
 {
  tn.img.src="../images/barL.gif";
 }
 else
 {
  tn.img.src="../images/barH.gif";
 }

 return tn;
}

function delTreeNode(index)
{
 var tr,tr2;
 index = parseInt(index);
 tr2 = null;
 if ( this.nodes[index].toString() != "[tree node]" )
 {
  tr = this.nodes[index].subTree;
  tr2 = tr.nextSibling;
  this.tree.deleteRow(tr2.rowIndex);
 }
 else
 {
  tr = this.nodes[index].tree;
 }
 this.tree.deleteRow(tr.rowIndex);

 var tmpNodes = new Array;
 for(i=0;i<parseInt(index);i++)
 {
 tmpNodes[i] = this.nodes[i];
 }
 for(i=parseInt(index)+1;i<this.nodes.length;i++)
 {
  tmpNodes[i-1] = this.nodes[i];
 }
 this.nodes=tmpNodes;
 
 if(this.length()==0)
 {
  this.TreeRow.style.display="none";
 }

 if((index==this.nodes.length)&&(index!=0))
 {
  var pre = this.nodes[index-1];
  if(pre.toString()=="[tree branch]")
  {
   if(pre.opened)
   {
    pre.img.src="../images/minusL.gif";
   }
   else
   {
    pre.img.src="../images/plusL.gif";
   }
   pre.TreeRow.cells[0].style.backgroundImage="";
  }
  else
  {
   pre.img.src="../images/barL.gif";
  }
 }
}

function treeGetLength()
{
 return this.nodes.length;
}

function treeToString()
{
 return "[tree]";
}

function treeAddBranch(index , branch)
{
 index = parseInt(index);

 if(index>this.nodes.length)index = this.nodes.length;
 var cindex = 0;
 for(i=0;(i<this.nodes.length)&&(i<index);i++)
 {
  if(this.nodes[i]=="[tree node]")
  {
   cindex++;
  }
  else if(this.nodes[i]=="[tree branch]")
  {
   cindex+=2;
  }
 }
 var tr = this.tree.insertRow(cindex);

 branch.parent = this;
 if ( typeof(branch.tdMouseOver) == "undefined")branch.tdMouseOver = this.tdMouseOver;
 if ( typeof(branch.tdMouseOut) == "undefined")branch.tdMouseOut = this.tdMouseOut;
 if ( typeof(branch.spanMouseOver) == "undefined")branch.spanMouseOver = this.spanMouseOver;
 if ( typeof(branch.spanMouseOut) == "undefined")branch.spanMouseOut = this.spanMouseOut;

 var td;
 td = tr.insertCell(0);
 td.height=22;
 td.width=22;
 if(index==this.length())
 {
 td.innerHTML="<img src=/"../images/plusL.gif/" border=0 onclick=/"this.branch.ExpandOrClose();/">";
 }
 else
 {
 td.innerHTML="<img src=/"../images/plus.gif/" border=0>";
 }
 branch.img = td.firstChild;
 branch.img.branch = branch;
 td.vAlign="middle";
 td.noWrap = true;
 
 td = tr.insertCell(1);
 td.height=22;
 td.vAlign="middle";
 td.noWrap = true;
 td.innerHTML = "<table border=0 cellpadding=0 cellspacing=0><tr><td><img src=/"" + branch.openImg + "/" border=0 onclick=/"this.branch.ExpandOrClose();/"></td><td nowrap>&nbsp;<label treeType='branch' style='cursor:default;'>"+branch.text+"</label>&nbsp;</td></tr></table>";
 branch.icon = td.firstChild.rows[0].cells[0].firstChild;
 branch.icon.branch = branch;
 branch.textSP = td.firstChild.rows[0].cells[1].firstChild.nextSibling;

 branch.subTree = tr;

 tr = this.tree.insertRow(cindex+1);
 tr.style.display="none";
 td = tr.insertCell(0);
 td.width=22;
 td.innerHTML="";
 if(index!=this.nodes.length)
 {
 td.style.backgroundImage="url(../images/barI.gif)";
 }
 td.noWrap = true;
 td = tr.insertCell(1);
 td.innerHTML="<table cellspacing=0 cellpadding=0 border='0'></table>";
 td.noWrap = true;

 branch.tree = td.firstChild;
 branch.TreeRow = tr;

 td.onmouseover = new Function("this.className='"+branch.tdMouseOver+"';");
 td.onmouseout = new Function("this.className='"+branch.tdMouseOut+"';");
 td.className = branch.tdMouseOut;
 
 branch.tree.branch = branch;
 branch.subTree.branch = branch;
 branch.textSP.branch = branch;
 branch.textSP.onclick = new Function("this.branch.TextSPClicked();");
 branch.textSP.ondblclick = new Function("this.branch.ExpandOrClose();this.branch.TextSPClicked();");
 branch.textSP.onmouseover = new Function("this.className='"+branch.spanMouseOver+"';");
 branch.textSP.onmouseout = new Function("this.className='"+branch.spanMouseOut+"';");
 branch.textSP.className = branch.spanMouseOut;

 var tmpNodes = new Array;
 for(i=0;i<index;i++)
 {
  tmpNodes[i]=this.nodes[i];
 }
 tmpNodes[tmpNodes.length]=branch;
 for(i=index;i<this.nodes.length;i++)
 {
  tmpNodes[i+1]=this.nodes[i];
 }
 this.nodes=tmpNodes;

 branch.close();

 if(index!=0)
 {
  var preSibling = this.nodes[index-1];
  if(preSibling.toString()=="[tree branch]")
  {
   if(preSibling.opened)
   {
    preSibling.img.src="../images/minus.gif"
   }
   else
   {
    preSibling.img.src="../images/plus.gif"
   }
   preSibling.TreeRow.cells[0].style.backgroundImage="url(../images/barI.gif)";
  }
  else
  {
   preSibling.img.src="../images/barH.gif";
  }
 }

 if(this.opened)
 {
  this.TreeRow.style.display="";
 }

 return branch;
}

function tree(parentNode)
{
 this.nodes = new Array();
 this.addNode = addTreeNode;
 this.addBranch = treeAddBranch;
 this.delNode = delTreeNode;
 this.length = treeGetLength;
 this.toString = treeToString;

 this.tdMouseOver = "treetdMouseOver";
 this.tdMouseOut = "treetdMouseOut";
 this.spanMouseOver = "treespanMouseOver";
 this.spanMouseOut = "treespanMouseOut";

 this.tree = "";
 if(MM_findObj(parentNode)!=null){
  this.tree = MM_findObj(parentNode);
 }
}

function treeNodeText(text)
{
 this.text = text;
 this.textSP.innerHTML = text;
 if(this.NodeClass)
 {
  this.setClass(this.NodeClass);
 }
}

function treeNodeAction(text)
{
 this.nodeAction = text;
}

function treeNodeToString()
{
return "[tree node]";
}

function treeNodeSelected()
{
 var p = null;
 p = this.parent;
 while((p.parent!=null)&&(typeof(p.parent)!="undefined"))
 {
  p = p.parent;
 }

 treeUnselect(p);

 this.textSP.parentNode.style.border="1px dotted #808080";

 this.selected = true;

 this.iconImg.src = this.selIcon;

 if(this.nodeAction!=null)
 {
  eval(this.nodeAction);
 }
}

function treeNodeSetClass(cnspan)
{
 this.tree.cells[1].onmouseover = null;//new Function("this.className='"+cnspan+"MouseOver';");
 this.tree.cells[1].onmouseout = null;//new Function("this.className='"+cnspan+"MouseOut';");
 this.tree.cells[1].className = '';//cnspan+"MouseOut";

 this.NodeClass = cnspan;

// this.tree.cells[1].firstChild.onmouseover = new Function("this.className='"+cnspan+"MouseOver';");
// this.tree.cells[1].firstChild.onmouseout = new Function("this.className='"+cnspan+"MouseOut';");
// this.tree.cells[1].firstChild.className = cnspan+"MouseOut";

 if(this.textSP)
 {
  this.textSP.onmouseover = new Function("this.className='"+cnspan+"MouseOver';");
  this.textSP.onmouseout = new Function("this.className='"+cnspan+"MouseOut';");
  this.textSP.className = cnspan+"MouseOut";
 }
}

function treeNodeSetIcon(icon , selIcon)
{
 this.icon = icon;
 this.selIcon = selIcon;
 if(this.selected == true)
 {
  this.icon.src = this.selIcon;
 }
 else
 {
  this.icon.src = this.icon;
 }
}

function onTreeNodeDragStart()
{
 eval(this.ondragstartAction);
}

function treeNodeOnUnselect()
{
 this.textSP.parentNode.style.border="";
 this.selected = false;
}

function treeNode(tr)
{
 this.tree = tr;
 this.img = tr.cells[0].firstChild;
 this.text = "";
 this.data = "";
 this.selIcon = "";
 this.icon = "";
 this.nodeAction = "";
 this.selected = false;
 this.setText = treeNodeText;
 this.setAction = treeNodeAction;
 this.setIcon = treeNodeSetIcon;
 this.onSelected = treeNodeSelected;
 this.toString = treeNodeToString;
 this.setClass = treeNodeSetClass;
 this.ondargstart = onTreeNodeDragStart;
 this.onUnselect = treeNodeOnUnselect;
}

function treeBranchToString()
{
 return "[tree branch]";
}

function treeNodeGetIndex()
{
 var index = 0;
 var p = this.parent;
 var i;
 for(i=0;i<p.length();i++)
 {
  if(p.nodes[i]==this)
  {
   index = i;
   break;
  }
 }
 return index;
}

function treeBranchExpand()
{
 var index = this.getIndex();
 this.tree.style.display='';
 this.TreeRow.style.display='';

 if(index==this.parent.length()-1)
 {
 this.img.src = "../images/minusL.gif";
 }
 else
 {
 this.img.src = "../images/minus.gif";
 }
 this.icon.src = this.openImg;
 this.opened=true;
}

function treeBranchClose()
{
 this.tree.style.display='none';
 this.TreeRow.style.display='none';

 var index = this.getIndex();

 if(index==this.parent.length()-1)
 {
 this.img.src = "../images/plusL.gif";
 }
 else
 {
 this.img.src = "../images/plus.gif";
 }
 this.icon.src = this.closeImg;
 this.opened=false;
}

function treeBranchExpandOrClose()
{
 if(this.opened==false)
 {
 this.expand();
 }
 else
 {
 this.close();
 }
 if(this.onExpandOrClose!=null)
 {
 eval(this.onExpandOrClose);
 }
}

function treeUnselect(p)
{
 if( (typeof(p.textSP)!="undefined") && (p.textSP!=null) )
 {
  p.onUnselect();
 }
 if( (typeof(p.nodes)!="undefined") && (p.nodes!=null) )
 {
  var i=0;
  for(i=0;i<p.nodes.length;i++)
  {
   treeUnselect(p.nodes[i]);
  }
 }
}

function treeBranchTextSPClicked()
{
 var p = null;
 p = this.parent;
 while((p.parent!=null)&&(typeof(p.parent)!="undefined"))
 {
  p = p.parent;
 }

 treeUnselect(p);

 this.textSP.parentNode.style.border="1px dotted #808080";

 this.selected = true;

 if(this.onTextSPClick!=null)
 {
  eval(this.onTextSPClick);
 }
}

function treeBranchSetClass(cnspan)
{
 this.subTree.cells[1].onmouseover = null;
 this.subTree.cells[1].onmouseout = null;
 this.subTree.cells[1].className = "";

 this.textSP.onmouseover = new Function("this.className='"+cnspan+"MouseOver';");
 this.textSP.onmouseout = new Function("this.className='"+cnspan+"MouseOut';");
 this.textSP.className = cnspan+"MouseOut";
}

function treeBranchSetText(text)
{
 this.text = text;
 this.textSP.innerHTML = text;
}

function treeBranchSetIcon(openImg , closeImg)
{
 this.openImg = openImg;
 this.closeImg = closeImg;
 if(this.opened == true)
 {
  this.icon.src = this.openImg;
 }
 else
 {
  this.icon.src = this.closeImg;
 }
}

function treeBranchClear()
{
 while(this.nodes.length>0)
 {
  this.delNode(0);
 }
}

function treeBranchOnUnselect()
{
 if( ( typeof(this.textSP)!="undefined" ) && ( this.textSP!=null ) )
 {
  if((typeof(this.textSP.parentNode)!="undefined")&&(this.textSP.parentNode!=null))
  {
   this.textSP.parentNode.style.border="";
   this.selected = false;
  }
 }
}

function treeBranch(text,openImg,closeImg,data,onExpandOrClose,onTextSPClick)
{
 this.text = text;
 this.data = data;
 this.openImg = openImg;
 this.closeImg = closeImg;


 this.opened = false;

 this.nodes = new Array();
 this.addNode = addTreeNode;
 this.addBranch = treeAddBranch;
 this.delNode = delTreeNode;
 this.length = treeGetLength;
 this.toString = treeBranchToString;
 this.expand = treeBranchExpand;
 this.close = treeBranchClose;
 this.ExpandOrClose = treeBranchExpandOrClose;
 this.TextSPClicked = treeBranchTextSPClicked;
 this.onExpandOrClose = onExpandOrClose;
 this.onTextSPClick = onTextSPClick;
 this.setClass = treeBranchSetClass;
 this.setText = treeBranchSetText;
 this.setIcon = treeBranchSetIcon;
 this.clear = treeBranchClear;
 this.getIndex = treeNodeGetIndex;
 this.onUnselect = treeBranchOnUnselect;

 this.tree = "";
 this.subTree = "";
 this.img = "";
 this.textSP = "";
}





调用代码及演示地址:
http://www.bqprog.com/HDOA/Main/Login.aspx
登录名称: admin
登录密码: admin

左栏菜单栏为演示

调用说明正在撰写中

阅读全文
0 0

相关文章推荐

img
取 消
img