/*
*☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆
*★ ★
*☆ Javascript 通用树形控件 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> <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> <label treeType='branch' style='cursor:default;'>"+branch.text+"</label> </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
左栏菜单栏为演示
调用说明正在撰写中