那位大哥帮忙解决一下有关生成树状三级菜单的问题(附原码,分不够可在加)

Question

//标志每种类型对应的角色的起始终止坐标
var m_arrStartEnd = new Array();//-------------------------------------------------------------------
// 名称：
// getTableHeadHTML(arrThs,arrWidth)
// 功能：
// 生成参照表格头的HTML
// 参数：
// arrThs 表头提示文字数组
// arrWidth 每列宽度数组
// 返回：
// 生成的参照表格表头HTML
//-------------------------------------------------------------------
function getTableHeadHTML(arrThs,arrWidth)
{
var sHTML = "\t<TR>\n";
for(var i=0;i<arrThs.length;i++)
{
if(i==0)
sHTML += "<TH class='cThLeft' width='" + arrWidth[i] +"'>&nbsp;</TH>";
else
sHTML += "<TH class='cTh' width='" + arrWidth[i] + "'>" + arrThs[i] + "</TH>";
}
sHTML += "\t</TR>\n";
return sHTML;
}//-------------------------------------------------------------------
// 名称：
// getFatherHTML(iType,arrTypeName,s)
// 功能：
// 生成树状参照的树干的HTML字符串
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// arrTypeName 类型、名称对应的二维数组，但只有两行，
// 第一行存类型，第二行存名称说明
// s 参照折叠按钮采用"+/-"字符串，还是图标(s == "img")
// 返回：
// 生成树状参照的树干的HTML字符串
//-------------------------------------------------------------------
function getFatherHTML(iType,arrTypeName,s)
{
var sHTML = "<TR bgcolor='linen'>\n";
if(s == "img")
sHTML += "<TD class='cTdLeft' align='center'>" + 
"<img id='imgExpand' name='imgExpand' onclick='img_onclick(" + 
String(iType) + ")'" +
" src='../images/minus.gif' style='cursor:hand'></img></td>";
else
sHTML += "<TD class='cTdLeft' align='center'>" + 
"<label id='lblExpand' name='lblExpand' class='cLblExpand' " + 
"onclick='lbl_onclick(" + String(iType) + 
")'>-</label></TD>";
sHTML += "<TD class='cTd' colspan='2'>" +
 "<INPUT type='checkbox' id='chkAllSel' name='chkAllSel' " + 
 "onclick='chkAllSel_onclick(" + String(iType) +
 ");' language='javascript''>" +
 "</INPUT>" + getNameFromType(iType,arrTypeName) + "</TD>" ;
sHTML += "</TR>\n";
return sHTML;
}

Answer 1

//-------------------------------------------------------------------
// 名称：
// getNameFromType(iType,arrTypeName)
// 功能：
// 根据类型，获取功能说明
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// arrTypeName 类型、名称对应的二维数组，但只有两行，
// 第一行存类型，第二行存名称说明
// 返回：
// 对应的功能说明，如果没有找到，返回空格的超文本实体("nbsp;")。
//-------------------------------------------------------------------
function getNameFromType(iType,arrTypeName)
{
for(var i=0;i<arrTypeName[0].length;i++)
{
if(iType==arrTypeName[0][i])return arrTypeName[1][i];
}
return "&nbsp;";
}//-------------------------------------------------------------------
// 名称：
// getChildrenHTML(arr,arrWidth)
// 功能：
// 获取树状参照的孩子的HTML字符串
// 参数：
// arr 孩子数据的二维数组
// arrWidth 每列的宽度数组
// 返回：
// 获取树状参照的孩子的HTML字符串
//-------------------------------------------------------------------
function getChildrenHTML(arr,arrWidth)
{
var sHTML = "";
for(var i=0;i<arr.length;i++)
{
sHTML += "\t<TR bgcolor='white'>\n";
for(var j=0;j<arr[i].length-3;j++)
{
switch(j)
{
case 0:
if(i == arr.length-1)
sHTML += "<TD class='cTdLeft' align='center'><image src='../images/bottom.gif' width='" + arrWidth[0] + "' height='20px'></image></TD>";
else
sHTML += "<TD class='cTdLeft' align='center'><image src='../images/middle.gif' width='" + arrWidth[0] + "' height='20px'></image></TD>";
break;
case 1:
sHTML += "<TD title='" + arr[i][arr[i].length-2] + "'";
sHTML += " class='cTd'><INPUT type='checkbox' id='chkSel' name='chkSel' title='" + arr[i][5] +
 "' onclick='chkSel_onclick(" + String(arr[i][0]) + ");' language='javascript' ";
if(arr[i][arr[i].length-3])
sHTML += " checked>" + arr[i][j] + "</TD>";
else
sHTML += ">" + arr[i][j] + "</TD>";
break;
default:
sHTML += "<TD class='cTd'>" + arr[i][j] + "</TD>";
break;
}
}
sHTML += "</TR>";
}
return sHTML;
}//-------------------------------------------------------------------
// 名称：
// getDataFromArray(iType,arrRoleData)
// 功能：
// 从所有的数据中，获取所有指定类型的数据数组
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// arrRoleData 所有的角色数据二维数组
// 返回：
// 满足指定类型的数据数组
//-------------------------------------------------------------------
function getDataFromArray(iType,arrRoleData)
{
var arr = new Array();
for(var i=0;i<arrRoleData.length;i++)
{
if(arrRoleData[i][0] == iType)
{
var p = arr.length;
arr[p] = new Array();
for(var j=0;j<arrRoleData[i].length;j++)
arr[p][j] = arrRoleData[i][j];
}
} 
return arr;
}

Answer 2

//-------------------------------------------------------------------
// 名称：
// getTableHTML(arrRoleData,arrTypeName,arrThs,arrWidth,sTbWidth)
// 功能：
// 根据传入的参数数据，生成整个树状参照的HTML字符串
// 参数：
// arrRoleData 所有的角色数据二维数组
// arrTypeName 类型、名称对应的二维数组，但只有两行，
// 第一行存类型，第二行存名称说明
// arrThs 表头说明文字数组
// arrWidth 各列宽度数组
// sTbWidth 整个表的宽度数组
// 返回：
// 根据传入参数生成的整个表格的HTML字符串
//-------------------------------------------------------------------
function getTableHTML(arrRoleData,arrTypeName,arrThs,arrWidth,sTbWidth)
{
if(arrThs.length != 3) return "";
var sHTML = "<TABLE cellpadding=0 id='tbTree' name='tbTree' cellspacing=0 border=0 width='" + sTbWidth + "'>\n";

sHTML += getTableHeadHTML(arrThs,arrWidth);
var iStart = 2;

for(var i=0;i<10;i++)
{
var arr = getDataFromArray(i,arrRoleData);
if(arr.length>0)
{
var p = m_arrStartEnd.length;
m_arrStartEnd[p] = new Array();
m_arrStartEnd[p][0] = i ;
m_arrStartEnd[p][1] = iStart;
m_arrStartEnd[p][2] = iStart + arr.length - 1 ;
iStart = iStart + arr.length + 1;

sHTML += getFatherHTML(i,arrTypeName,"img");
sHTML += getChildrenHTML(arr,arrWidth);
}
}

sHTML += "</TABLE>";
return sHTML;
}//-------------------------------------------------------------------
// 名称：
// getStart(iType)
// 功能：
// 根据类型获取指定类型在表格上的数据的起始行号
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 如果成功，返回起始行号，如果失败返回-1
//-------------------------------------------------------------------
function getStart(iType)
{
for(var i=0;i<m_arrStartEnd.length;i++)
if(m_arrStartEnd[i][0] == iType)
return m_arrStartEnd[i][1];
return -1;
}//-------------------------------------------------------------------
// 名称：
// getEnd(iType)
// 功能：
// 根据类型获取指定类型在表格上的数据的终止行号
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 如果成功，返回终止行号，如果失败返回-1
//-------------------------------------------------------------------
function getEnd(iType)
{
for(var i=0;i<m_arrStartEnd.length;i++)
if(m_arrStartEnd[i][0] == iType)
return m_arrStartEnd[i][2];
return -1;
}//-------------------------------------------------------------------
// 名称：
// lbl_onclick(iType)
// 功能：
// 如果是"+/-"号，用户点击扩展，收缩号时的响应函数
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 无
//-------------------------------------------------------------------
function lbl_onclick(iType)
{
var nStart = getStart(iType);
var nEnd = getEnd(iType);
if(nStart<0 || nEnd<0) return;
var szShow = "";
if(event.srcElement.innerText == "-")
{
szShow = "none";
event.srcElement.innerText = "+";
}
else
{
event.srcElement.innerText = "-";
}

for(var i=nStart;i<nEnd+1;i++)
{
tbTree.rows(i).style.display = szShow;
}
}

Answer 3

无限级:http://fason.nease.net/zhuanti/tree/deeptree_db.rar

Answer 4

可我还的用我的代码,请大哥分析分析;程序继续;
//-------------------------------------------------------------------
// 名称：
// img_onclick(iType)
// 功能：
// 如果是图片，用户点击扩展，收缩号时的响应函数
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 无
//-------------------------------------------------------------------
function img_onclick(iType)
{
var nStart = getStart(iType);
var nEnd = getEnd(iType);
if(nStart<0 || nEnd<0) return;
var szShow = "";
var s = String(event.srcElement.src); 

s = s.substr(s.length-"minus.gif".length,"minus.gif".length);

if(s == "minus.gif")
{
szShow = "none";
event.srcElement.src = "../images/plus.gif";
}
else
{
event.srcElement.src = "../images/minus.gif";
}

for(var i=nStart;i<nEnd+1;i++)
{
tbTree.rows(i).style.display = szShow;
}
}//-------------------------------------------------------------------
// 名称：
// chkAllSel_onclick(iType)
// 功能：
// 用户点击选择整个类型的数据的响应涵数
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 无
//-------------------------------------------------------------------
function chkAllSel_onclick(iType)
{
var nStart = getStart(iType);
var nEnd = getEnd(iType);
if(nStart<0 || nEnd<0) return;
var bChecked = event.srcElement.checked;
for(var i=nStart;i<=nEnd;i++)
{
tbTree.rows(i).cells(1).children(0).checked = bChecked;
}
}

Answer 5

//-------------------------------------------------------------------
// 名称：
// chkSel_onclick(iType)
// 功能：
// 用户点击选择一条角色数据的响应涵数
// 参数：
// iType 类型标志，如：0，1，2可以分别代表财务，进销存，CRM等
// 返回：
// 无
//-------------------------------------------------------------------
function chkSel_onclick(iType)
{
var objchk=event.srcElement;
var n = objchk.parentElement.parentElement.rowIndex;
var str1=tbTree.rows(n).cells(1).title;
var nStart = getStart(iType);
var nEnd = getEnd(iType);
var arrNoSingleFunc = new Array("100101","200202","200205","200402","200405","200408","200411","200111","200302","200305","200419");
var arrRelatedFunc = new Array("100102","200201","200204","200401","200404","200407","200410","200103","200301","200304","200418");
for(var i=nStart;i<=nEnd;i++)
{
for(var j=0;j<arrNoSingleFunc.length;j++)
{RelateFunc(i,str1,objchk,arrNoSingleFunc[j],arrRelatedFunc[j]);}
}
for(var i=nStart;i<=nEnd;i++)
{
if(tbTree.rows(i).cells(1).children(0).checked == false)
{
tbTree.rows(nStart-1).cells(1).children(0).checked = false;
return;
}
}

}//-------------------------------------------------------------------
// 名称：
// getCheckedValue()
// 功能：
// 获取选择的数据
// 参数：
// 无
// 返回：
// 用户选择数据
//-------------------------------------------------------------------
function getCheckedValue()
{
if(tbTree.rows.length == 3) 
if(chkSel.checked) return tbTree.rows(2).cells(1).innerText;
if(tbTree.rows.length > 3) 
{
var arr = new Array();
for(var i=0;i<chkSel.length;i++)
{
if(chkSel[i].checked)
{
var n = chkSel[i].parentElement.parentElement.rowIndex;
arr[arr.length] = tbTree.rows(n).cells(1).title;
}
}
if(arr.length > 0) return arr.join("#");
}
return "";
}//-------------------------------------------------------------------
// 名称：
// getCheckedBusValue()
// 功能：
// 获取选择的数据
// 参数：
// 无
// 返回：
// 用户选择数据
//-------------------------------------------------------------------
function getCheckedBusValue()
{
if(tbTree.rows.length == 3) 
if(chkSel.checked) return tbTree.rows(2).cells(1).innerText;
if(tbTree.rows.length > 3) 
{
var arr = new Array();
for(var i=0;i<chkSel.length;i++)
{
if(chkSel[i].checked)
{
var inti=chkSel[i].title;
if(inti>0 && inti!=6)
{var n = chkSel[i].parentElement.parentElement.rowIndex;
arr[arr.length] = tbTree.rows(n).cells(1).title;
}
}
}
if(arr.length > 0) return arr.join("#");
}
return "";
}

Answer 6

//-------------------------------------------------------------------
// 名称：
// RelateFunc(i,ChkFunc,objchk,strFunc1,strFunc2)
// 功能：
// 关联功能权限
// 参数：
//
// 返回：
// 无
//-------------------------------------------------------------------
function RelateFunc(i,ChkFunc,objchk,strFunc1,strFunc2)
{
if(ChkFunc==strFunc1)
{
if(tbTree.rows(i).cells(1).title==strFunc2)
if(objchk.checked) tbTree.rows(i).cells(1).children(0).checked = true;
}
if(ChkFunc==strFunc2)
{
if(tbTree.rows(i).cells(1).title==strFunc1)
if(!objchk.checked) tbTree.rows(i).cells(1).children(0).checked = false;
}
}//-------------------------------------------------------------------
// 名称：
// initRight()
// 功能：
// 初始化
// 参数：
// 无
// 返回：
// 无
//-------------------------------------------------------------------
function initRight()
{
for(var iType=0;iType<document.all("imgExpand").length;iType++)
{ var nStart = getStart(iType);
var nEnd = getEnd(iType);
if(nStart<0 || nEnd<0) return;
document.all("imgExpand")[iType].src = "../images/plus.gif";
for(var i=nStart;i<nEnd+1;i++)
{
tbTree.rows(i).style.display = "none";
}
}
}//-->
</SCRIPT>

Answer 7

直接使用jspsmartmenu就可以了！
www.jspsmart.com

Answer 8

www.wfjs.com/city/
这里有一个例子
不明白再问

Answer 9

n级树、下拉菜单http://xml.sz.luohuedu.net/

Answer 10

to :
net_lover(孟子E章) 
你的下拉菜单是如何实现的
他是死的吗，我的菜单要求其二三级实现你的样式，可是菜单由数据庫中取出为动态，我该如何实现呢？

Answer 11

net_lover(孟子E章) 
快来回答我的问题啊