使用Popup窗口创建无限级Web页菜单(4)

function Menu()

{

    this.m_Items = [];                  // 菜单条目集合

    this.m_Popup = null;            // 显示菜单的popup窗口

    this.m_Invalidate = false;     // 是否失效标志

    this.m_Drawn = false;          // 菜单是否已输出

    this.m_Opener = null;           // 菜单的父窗口window对象

    this.m_ParentMenu = null;  // 菜单的父菜单MenuItem对象

    this.m_ActiveItem = null;     // 被激活(highlighting)的MenuItem

    this.m_ShowTimer = null;   // 鼠标停留在有子菜单的条目上,子菜单显示延迟计时器

    this.m_Bounds = null;          // 菜单的bounds

    this.m_ShowHeaderBlank = true; // 是否显示MenuItem前的空白区域

    this.m_IsEventAttached = false;    // 事件是否attached

    this.m_Id = __MenuCache__.NewId(); // 或取菜单对象的唯一标识

    __MenuCache__[this.m_Id] = this; // 把菜单放入__MenuCache__

    this.toString = function()

    {

        return '[class Menu]';

    };

}

    菜单类的方法有：

Menu.prototype.Add = function(mi)

    // 添加菜单条目到菜单中

};

Menu.prototype.AddAt = function(mi, index)

    // 把菜单条目添加到指定的数组索引上

Menu.prototype.AddSeparator = function()

    // 添加一个Separator Item,就是我们在window菜单里的"-"

Menu.prototype.Remove = function(mi)

    // 删除菜单中的一个菜单条目

Menu.prototype.Contains = function(menu)

    // 判断已构建的菜单中是否已包含了menu

Menu.prototype.Render = function()

    // 生成菜单UI显示需要的DHTML

Menu.prototype.__generatePaddingTR = function(doc)

    // 为了美化菜单UI生成的一个TR element

Menu.prototype.AttachEvents = function(menu)

    // attach事件处理函数到菜单事件上

Menu.prototype.ActiveItem = function(evt)

    // 处理菜单itme被Active后的UI和动作等

Menu.prototype.Hide = function()

    // 隐藏菜单

Menu.prototype.Keydown = function(evt)

    // 处理键盘按键

Menu.prototype.Click = function()

    // 执行菜单被click

Menu.prototype.ResumeItem = function(evt)

    // 恢复菜单,取消active和恢复UI

Menu.prototype.__resumeItem = function()

    // 执行UI恢复

Menu.prototype.__resumeAll = function()

    // 执行批量UI恢复

Menu.prototype.__activeItem = function()

    // 执行UI激活

Menu.prototype.HasSubMenuExpanded = function()

    // 判断菜单是否有展开的submenu

Menu.prototype.__isEllipsis = function(menuObj, menuHtml)

    // 在菜单item的text过长时将截断并显示"

"

Menu.prototype.Show = function(evt)

    // 显示菜单

Menu.prototype.InnerShow = function()

    // 显示submenu,用于菜单内部触发的菜单显示

Menu.prototype.__show = function(miObj)

    // 执行菜单显示

Menu.prototype.FadeinEffect = function(effect)

    // 菜单显示式的特效,是用filter来实现,只在Show菜的时候调用

    类MenuItem比Menu类简单很多，定义如下：

function MenuItem(text, action, icon, shortcut, menu)

    this.m_Text = text;                // 菜单文本

    this.m_Action = action;        // 菜单条目被触发时执行的函数

    this.m_Icon = icon;               // 菜单条目前的图标路径

    this.m_ChildMenu = menu; // 子菜单,类型为Menu对象

    this.m_Menu = null;              // 本菜单条目所在的菜单对象实例

    this.m_ShortCut = shortcut; // 快捷方式(保留,未实现)

    this.m_Disabled = false;      

    this.m_Mnemonic = null;

    this.m_Tooltip = null;

    this.m_Attributes = [];          // 附加属性集合,由SetAttribute设置

    this.m_Id = __MenuCache__.NewId();

    __MenuCache__[this.m_Id] = this;

        return '[class MenuItem]';

    MenuItem类的方法如下：

MenuItem.prototype.Contains = function(menu)

    // 子菜单中是否已添加menu

MenuItem.prototype.SetAttribute = function(key, value)

    // 设置用户定义的属性

MenuItem.prototype.GetAttribute = function(key)

    // 或取用户定义的属性

MenuItem.prototype.Invalidate = function()

    // 失效

MenuItem.prototype.IsSeparator = function()

    // 判断MenuItem是否为Separator,就是其m_Text == '-'

MenuItem.prototype.Render = function()

    // 生成菜单UI的DHTML

MenuItem.prototype.SetBorderColor = function(miHtml, width, borderColor)

    // 设置菜单条目的边框颜色

    "__"开头的方法是内部方法，不提供给类外使用。变量命名规则m_开头的是类属性变量，Obj结尾的是菜单类对象，和它相对的是Html结尾的，使菜单的HTML元素对象，常见的是menuObj、menuHtml、miObj和miHTML。

    Menu类中最重要的方法是：

    MenuItem主要是处理UI显示，没有太重要的方法。 

本文转自博客园鸟食轩的博客，原文链接：http://www.cnblogs.com/birdshome/，如需转载请自行联系原博主。