请问如何制作动态联动二级菜单！

http://community.csdn.net/Expert/TopicView2.asp?id=4987085

其实我想要达到的效果和树还是有区别的，我是一开始把所有的大类菜单在列出来，然后当鼠标onmouseover的时候去取子类，并且在它的右侧直接列出子类菜单项，当鼠标ommouseout的时候，子类菜单也自动隐藏。就像一般的网页导航一样，只不过那些菜单是当鼠标放上去的时候在它们下方显示子菜单，我希望在它边显示子菜单。

OPTION
CLASS=classname
ID=value
LANGUAGE=JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS
SELECTED
VALUE=value
event = script
>
event  Can be one or more of these events: 1:ondragstart  2:onselectstart //目前OPTION  只支持这两种事件---不符合你的需求;/**********select 支持的事件**************/
event  Can be one or more of these events: onafterupdate  onbeforeupdate
onblur  onchange
onclick  ondblclick
ondragstart  onfocus
onhelp  onkeydown
onkeypress  onkeyup
onmousedown  onmousemove
onmouseout  onmouseover
onmouseup  onresize
onrowenter  onrowexit
onselectstart /****************/ 所以如果要实现"当鼠标放上去时在相应的目录右边出现它对应的子目录",如查不是响应onchange,而是直接去响应onmouseout,你可能不能取到第一联的元素,(除非你只有一个元素),而OPTION又不支持onmouseover....,所以可以试着去模拟一个列表.

<ul>和<li>标签结合做效果不错效果参考：
http://www.91do.net/leon/menu/menu1.htm
http://www.91do.net/leon/menu/menu2.htm

误会楼主的意思,这是手头上的一个例子,具体内容与样式楼主自行调试:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT>
var menus    = new Array();
var isShow   = new Boolean();
isShow=false;
var isdown   = new Boolean();
isdown=false;
var srcel;
var fromel;
var toel;
var usestatus=false;
var thestatus="";
var popTimer = 0;
menucolor='#EEBF99';fontcolor='MenuText';menuoutcolor='#F3D5B8';menuincolor='#F8E8D6';menuoutbordercolor='#FCF3EF';menuinbordercolor='#000000';midoutcolor='#F2D0B5';midincolor='#9E7F66';menuovercolor='#E80005';menuunitwidth=160;menuitemwidth=160;menuheight=180;menuwidth='160';menuadjust=0;
menualign='center';leftchar='(无)';rightchar='(无)';fonts='font-family: 宋体; font-size: 9pt; color: MenuText; ';cursor='default';
var fadeSteps = 5;
var fademsec = 20;
var fadeArray = new Array();
function fade(el, fadeIn, steps, msec) {
if (steps == null) steps = fadeSteps;
if (msec == null) msec = fademsec;
if (el.fadeIndex == null)
  el.fadeIndex = fadeArray.length;
fadeArray[el.fadeIndex] = el;
if (el.fadeStepNumber == null) {
  if (el.style.visibility == "hidden")
   el.fadeStepNumber = 0;
  else
   el.fadeStepNumber = steps;
  if (fadeIn)
   el.style.filter = "Alpha(Opacity=0)";
  else
   el.style.filter = "Alpha(Opacity=100)";
}
window.setTimeout("repeatFade(" + fadeIn + "," + el.fadeIndex + "," + steps + "," + msec + ")", msec);
}
function repeatFade(fadeIn, index, steps, msec) {
el = fadeArray[index];

c = el.fadeStepNumber;
if (el.fadeTimer != null)
  window.clearTimeout(el.fadeTimer);
if ((c == 0) && (!fadeIn)) {
  el.style.visibility = "hidden";
  return;
}
else if ((c==steps) && (fadeIn)) {
  el.style.filter = "";
  el.style.visibility = "visible";
  return;
}
else {
  (fadeIn) ?  c++ : c--;
  el.style.visibility = "visible";
  el.style.filter = "Alpha(Opacity=" + 100*c/steps + ")";
  el.fadeStepNumber = c;
  el.fadeTimer = window.setTimeout("repeatFade(" + fadeIn + "," + index + "," + steps + "," + msec + ")", msec);
}
}
function popOut() {
popTimer = setTimeout('allhide()', 1000);
}
function getReal(el, type, value) {
temp = el;
while ((temp != null) && (temp.tagName != "BODY")) {
  if (eval("temp." + type) == value) {
   el = temp;
   return el;
  }
  temp = temp.parentElement;
}
return el;
}
function MenuRegister(menu)
{
  menus[menus.length] = menu
  return (menus.length - 1)
}
function MenuItem(caption,command,target,isline,statustxt){
this.caption=caption;
this.command=command;
this.target=target;
this.isline=isline;
this.statustxt=statustxt;
}
function Menu(caption,command,target){
this.items = new Array();
this.caption=caption;
this.command=command;
this.target=target;
this.id=MenuRegister(this);
}
function MenuAddItem(item)
{
  this.items[this.items.length] = item
  item.parent = this.id;
  this.children=true;
}
Menu.prototype.addItem = MenuAddItem;
function toout(src){
src.style.borderLeftColor=menuoutbordercolor;
src.style.borderRightColor=menuinbordercolor;
src.style.borderTopColor=menuoutbordercolor;
src.style.borderBottomColor=menuinbordercolor;
src.style.backgroundColor=menuoutcolor;
src.style.color=menuovercolor;
}
function toin(src){
src.style.borderLeftColor=menuinbordercolor;
src.style.borderRightColor=menuoutbordercolor;
src.style.borderTopColor=menuinbordercolor;
src.style.borderBottomColor=menuoutbordercolor;
src.style.backgroundColor=menuincolor;
src.style.color=menuovercolor;
}
function nochange(src){
src.style.borderLeftColor=menucolor;
src.style.borderRightColor=menucolor;
src.style.borderTopColor=menucolor;
src.style.borderBottomColor=menucolor;
src.style.backgroundColor=menucolor;
src.style.color=fontcolor;
}
function allhide(){
for(var nummenu=0;nummenu<menus.length;nummenu++){
  var themenu=document.all['menu'+nummenu]
  var themenudiv=document.all['menudiv'+nummenu]
                nochange(themenu);
                menuhide(themenudiv);
                }
}
function menuhide(menuid){
fade(menuid,false,6);
isShow=false;
}
function menushow(menuid,pid){
menuid.style.left=menutable.offsetLeft+menuadjust+parseInt(menuwidth);menuid.style.top=menutable.offsetTop+pid.offsetTop;fade(menuid,true,6);
isShow=true;
}
function menu_over(menuid,x){
toEl = getReal(window.event.toElement, "className", "coolButton");
fromEl = getReal(window.event.fromElement, "className", "coolButton");
if (toEl == fromEl) return;
srcel = window.event.srcElement;
if(menus[x].command==""){
  allhide();
  toin(srcel);
  menushow(menuid,eval("menu"+x));
}else{
  isShow = false;
  allhide();
  toout(srcel);
}
clearTimeout(popTimer);
}
function menu_out(menuid){
toEl = getReal(window.event.toElement, "className", "coolButton");
fromEl = getReal(window.event.fromElement, "className", "coolButton");
if (toEl == fromEl) return;
srcel = window.event.srcElement;
if (isShow){
toin(srcel);
}else{
nochange(srcel);
}
popOut()
}
function menu_down(menuid,x){
srcel = getReal(window.event.srcElement, "className", "coolButton");
if(menus[x].command==""){
  if(isShow){
  menuhide(menuid);
  toout(srcel);
  }
  else{
  toin(srcel);
  menushow(menuid,eval("menu"+x));
  isdown=true;
  }
}else{
  toin(srcel);
  isdown=true;
}
}
function menu_up(){
  isdown=false;
}

谢谢“lantersen(蓝水仁--秋风飒爽__至少你我都有梦！~) ”，研究中！

to:"lantersen(蓝水仁--秋风飒爽__至少你我都有梦！~)",你的代码在我这能用了，谢了，我还想问下我这第一行怎么出不了第二联菜单呢？

http://blog.sina.com.cn/u/1241305033#aList_1你去这里面看看

调试易

请问如何制作动态联动二级菜单！

解决方案 »