<script language="javascript">
<!--/*类名:CascadeMenu
属性:
collapse 此菜单是否折起
level 菜单级别
Child 子菜单对象数组
name 对应层的ID
title 标题 
url 链接
width 宽度
height 高度
方法:Draw() 绘制菜单
AddChild(title,url)构造子项
Expand(id)展开/折叠菜单
全局变量:
CollapseImage 全局变量,定义一级菜单收起时的图标
ExpandImage 全局变量,定义一级菜单展开时的图标
作者:heroman
版权:免费使用,可以任意修改,但请勿移除本段文字
*/var CollapseImage="http://img.163.com/club/uh/line_01.gif";//全局变量,定义一级菜单收起时的图标
var ExpandImage="http://img.163.com/club/uh/line_02.gif";//全局变量,定义一级菜单展开时的图标
function Expand()
{ this.collapse=!this.collapse
var i;
var ChildObj;
if (this.Child.length>0)
{
for (i in this.Child)
{
ChildObj=this.Child[i];
if (document.all(ChildObj.name).style.display=="none")
document.all(ChildObj.name).style.display="block";
else
ChildObj.Collapse();
}
if (!this.collapse)
document.all(this.name+"_Image").src=ExpandImage;
else
document.all(this.name+"_Image").src=CollapseImage;
}
}function Collapse()
{
var i;
this.Hide();
for(i in this.Child)
{
this.Child[i].Collapse();
}
}function AddChild(ChildObject)
{
this.Child[this.Child.length]=ChildObject;
}function Draw()
{ var space="";
var i=1;
while (i<=(this.level-1)*2)
{
space=space+"&nbsp;";
i=i+1;
}
document.write ("<div id='"+this.name+"' style='display:block;padding-bottom:5px;width="+this.width+"px;height="+this.height+"px'>"+space+"<img id='"+this.name+"_Image' src='"+CollapseImage+"' border=0  align=absmiddle alt='click it to Expand/Collapse This Tree' onclick=try{"+this.name+".Expand()}catch(e){alert(e.toString())}> <a href='"+this.url+"'>"+this.title+"</a></div>");
if (this.Child.length>0)
{
var ChildObj;
for (i in this.Child)
{
ChildObj=this.Child[i];
ChildObj.Draw();
//ChildObj.HideLevel();
}
this.HideLevel();
}
}function Hide()
{
document.all(this.name).style.display="none";
}function HideLevel()
{
var i;
var ChildObj;
if (this.Child.length>0)
{
for (i in this.Child)
{ChildObj=this.Child[i];
 ChildObj.Hide();
}
}
}function CascadeMenu(level,name,width,height,title,url)
{
this.collapse=true;
this.level=level;
this.Child=new Array();
this.name=name;
this.width=width;
this.height=height;
this.title=title;
this.url=url;
this.Draw=Draw;
this.AddChild=AddChild;
this.Expand=Expand;
this.HideLevel=HideLevel;
this.Hide=Hide;
this.Collapse=Collapse;

var o = new CascadeMenu(1,"menu",100,200,"hello","www.csdn.net");
o.collapse=true;
o.Draw();
o.AddChild("-----","#");
o.AddChild("-----","#");
o.AddChild("-----","#");
o.AddChild("-----","#");
o.AddChild("-----","#");
o.Expand();//-->
</script>
到此为止 :(

解决方案 »

  1.   

    把这段代码
    var o = new CascadeMenu(1,"menu",100,200,"hello","www.csdn.net");
    o.collapse=true;
    o.Draw();
    o.AddChild("-----","#");
    o.AddChild("-----","#");
    o.AddChild("-----","#");
    o.AddChild("-----","#");
    o.AddChild("-----","#");
    o.Expand();
    放进一个函数比如make_menu(),然后把文件保存为menu.js在自己的页面中页头引入
    <script src="menu.js的路径"></script>
    在body中要使用menu的地方比如一个table的td内
    <td><script>make_menu()</script></td>自己试试吧,我没试过,不负责任:)
      

  2.   

    menu = new CascadeMenu(1,"menu",20,22,"test","#");
    bar1 = new CascadeMenu(2,"bar1",40,22,"111","#");
    menu.AddChild(bar1)
    bar2 = new CascadeMenu(2,"bar2",40,22,"222","#");
    menu.AddChild(bar2)
    bar3 = new CascadeMenu(2,"bar3",40,22,"333","#");
    menu.AddChild(bar3)
    bar4 = new CascadeMenu(3,"bar4",60,22,"333-1","#");
    bar3.AddChild(bar4)menu.Draw()