menu.js:
if (document.all)    {n=0;ie=1;fShow="visible";fHide="hidden";}
if (document.layers) {n=1;ie=0;fShow="show";   fHide="hide";}window.onerror=new Function("return true") //忽略事件默认行为,参见msdn/忽略错误rightX = 0;
function Menu()
{
this.bgColor     = "#008080";
if (ie) this.menuFont = "bold xx-small Verdana"; //table font property
this.fontColor   = "Red";
this.addItem    = addItem;
this.addSubItem = addSubItem;
this.showMenu   = showMenu;
this.mainPaneBorder = 0; //table of Menu Border property
this.subMenuPaneBorder = 0; //table of Submenu Border property this.subMenuPaneWidth = 150; //table width lastMenu = null;  

rightY = 0;
leftY = 0;
leftX = 0; HTMLstr = "";
HTMLstr += "<!-- MENU PANE DECLARATION BEGINS -->\n";
HTMLstr += "\n";
if (ie) HTMLstr += "<div id='MainTable' style='position:relative'>\n";

HTMLstr += "<table width='100%' bgcolor='"+this.bgColor+"' border='"+this.mainPaneBorder+"'>\n";
HTMLstr += "<tr>";
HTMLstr += "<!-- MAIN MENU STARTS -->\n";
HTMLstr += "<!-- MAIN_MENU -->\n";
HTMLstr += "<!-- MAIN MENU ENDS -->\n"; HTMLstr += "</tr>\n";
HTMLstr += "</table>\n";
HTMLstr += "\n";
HTMLstr += "<!-- SUB MENU STARTS -->\n";
HTMLstr += "<!-- SUB_MENU -->\n";
HTMLstr += "<!-- SUB MENU ENDS -->\n";
HTMLstr += "\n";
if (ie) HTMLstr+= "</div>\n"; HTMLstr += "<!-- MENU PANE DECALARATION ENDS -->\n";
}
/**
Description:Create Menu Item
Parameter:
idItem:Menu Item ID
text: Menu Item text string
hint:hint for Menu Item
mlocation:Menu Item URL reference
altlocaiton:alternate Menu Item URL reference //不了解这个参数有什么意义?
**/
function addItem(idItem, text, hint, mlocation, altLocation)
{
var Lookup = "<!-- ITEM "+idItem+" -->";
if (HTMLstr.indexOf(Lookup) != -1)
{
alert(idParent + " already exist");
return;
}
var MENUitem = "";
MENUitem += "\n<!-- ITEM "+idItem+" -->\n";
if (ie)
{
MENUitem += "<td>\n";
MENUitem += "<div id='"+idItem+"' style='position:relative; font: "+this.menuFont+";'>\n";
MENUitem += "<a ";
MENUitem += "class=clsMenuItemIE ";
MENUitem += "style='text-decoration: none; font: "+this.menuFont+"; color: "+this.fontColor+"; cursor: hand'";
if (hint != null)
MENUitem += "title='"+hint+"'";
if (mlocation != null)
{
MENUitem += "href='"+mlocation+"'";
MENUitem += "onmouseover=\"hideAll()\" "; //\"为转义字符
//1.但是这里用hideall()不是很理解,若其下有子菜单,不是点不到?
//还是说ms本意为若不为null,则没有子菜单
}
else
{
if (altLocation != null)
MENUitem += "href='"+altLocation+"'";
else
MENUitem += "href='.' ";
MENUitem += "onmouseover=\"displaySubMenu('"+idItem+"')\" ";
MENUitem += "onclick=\"return false;\" ";
}
MENUitem += ">";
MENUitem += "|&nbsp;\n";
MENUitem += text;
MENUitem += "</a>\n";
MENUitem += "</div>\n";
MENUitem += "</td>\n";
}
MENUitem += "<!-- END OF ITEM "+idItem+" -->\n\n";
MENUitem += "<!-- MAIN_MENU -->\n"; HTMLstr = HTMLstr.replace("<!-- MAIN_MENU -->\n", MENUitem);
}/**
Description:Create SubMenu
Parameters:
idParent:The parent of SubMenu
text: SubMenu text string
hint: hint for submenu
mlocation: submenu URL reference
**/
function addSubItem(idParent, text, hint, mlocation)
{
var MENUitem = "";
Lookup = "<!-- ITEM "+idParent+" -->";
if (HTMLstr.indexOf(Lookup) == -1)
{
alert(idParent + " not found");
return;
}
Lookup = "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->";
if (HTMLstr.indexOf(Lookup) == -1)
{
if (ie)
{
MENUitem += "\n";
MENUitem += "<div id='"+idParent+"submenu' style='position:absolute; visibility: hidden; width: "+this.subMenuPaneWidth+"; font: "+this.menuFont+"; top: -300;'>\n"; MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n";
MENUitem += "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
MENUitem += "</table>\n";
MENUitem += "</div>\n";
MENUitem += "\n";
}
MENUitem += "<!-- SUB_MENU -->\n";
HTMLstr = HTMLstr.replace("<!-- SUB_MENU -->\n", MENUitem);
} Lookup = "<!-- NEXT ITEM OF SUB MENU "+ idParent +" -->\n";
//2.这里class=clsMenuItemIE,与上面menu的id重复,是否有问题?
if (ie) MENUitem = "<tr><td><a class=clsMenuItemIE title='"+hint+"' href='"+mlocation+"'>"+text+"</a><br></td></tr>\n";
MENUitem += Lookup;
HTMLstr = HTMLstr.replace(Lookup, MENUitem);}/**
Description:Output Menu
**/
function showMenu()
{
document.writeln(HTMLstr);
}
/**
Description:Make SubMenu visialbe
Comments:Private declaration
**/
function displaySubMenu(idMainMenu)
{
var menu;
var submenu;
if (n)
{
submenu = document.layers[idMainMenu+"submenu"];
if (lastMenu != null && lastMenu != submenu) hideAll();
submenu.left = document.layers[idMainMenu].pageX;
submenu.top  = document.layers[idMainMenu].pageY + 25;
submenu.visibility = fShow; leftX  = document.layers[idMainMenu+"submenu"].left;
rightX = leftX + document.layers[idMainMenu+"submenu"].clip.width;
leftY  = document.layers[idMainMenu+"submenu"].top+
document.layers[idMainMenu+"submenu"].clip.height;
rightY = leftY;
} else if (ie) {
menu = eval(idMainMenu); //获得名称为idmainmenu的对象的引用,作用与menu=document.all[idMainTable]相同?
submenu = eval(idMainMenu+"submenu.style");
//计算偏移量及显示子菜单
submenu.left = calculateSumOffset(menu, 'offsetLeft');
submenu.top  = calculateSumOffset(menu, 'offsetTop') + 30;
submenu.visibility = fShow; //3.看了整段代码,觉得lastmenu取值只有null或submenu,那这句代码什么时候起作用?
if (lastMenu != null && lastMenu != submenu) hideAll(); leftX  = document.all[idMainMenu+"submenu"].style.posLeft;
rightX = leftX + document.all[idMainMenu+"submenu"].offsetWidth; leftY  = document.all[idMainMenu+"submenu"].style.posTop+
document.all[idMainMenu+"submenu"].offsetHeight;
rightY = leftY;
}
lastMenu = submenu;
}/**
Description:Hide all menu,include submenu
**/
function hideAll()
{
if (lastMenu != null) {lastMenu.visibility = fHide;lastMenu.left = 0;}
//4.不解要left=0,每次显示菜单时候不是都会计算left的数值?
}/**
Description:Calculate total Offset
**/
function calculateSumOffset(idItem, offsetName)
{
var totalOffset = 0;
var item = eval('idItem');
do
{
totalOffset += eval('item.'+offsetName);
item = eval('item.offsetParent');
} while (item != null);
//body.offsetParent==null
return totalOffset;}
/**
Description:retrieves the x-coordinate of the mouse pointer's , if out of area ,hide all 
**/
function updateIt(e)
{
if (ie)
{
//获得鼠标的坐标
var x = window.event.clientX;
var y = window.event.clientY; if (x > rightX || x < leftX) hideAll();
else if (y > rightY) hideAll();
}
}if (document.all)
{
document.body.onclick=hideAll;
document.body.onscroll=hideAll;
document.body.onmousemove=updateIt;
}

解决方案 »

  1.   

    代码是我看代码的时候自己加的,带?号的部分为不解的地方,如下,请帮忙解惑:
    1、additem中alocation有什么意义?觉得这个参数没有用
    2、additem中 if (mlocation != null)
    {
    MENUitem += "href='"+mlocation+"'";
    MENUitem += "onmouseover=\"hideAll()\" "; 
    //1.但是这里用hideall()不是很理解,若其下有子菜单,不是点不到?
    //还是说ms本意为若不为null,则没有子菜单
    }
    3、addsubitem中,class=clsMenuItemIE,与上面menu的id重复,是否可以?
    4、displaysubmenu中,看了整段代码,觉得lastmenu取值只有null或submenu,那这句代码什么时候起作用? if (lastMenu != null && lastMenu != submenu) hideAll();
    5、function hideAll()
    {
    if (lastMenu != null) {lastMenu.visibility = fHide;lastMenu.left = 0;}
    //不解要left=0,每次显示菜单时候不是都会计算left的数值?
    }
    在线守候,盼望诸位高人抽空帮我看看,不胜感激。